:root {
  --tu-global-margin-v: 24px;
  --tu-global-margin-h: 24px;
  --tu-global-gap-v: 24px;
  --tu-global-gap-h: 24px;
  --tu-global-corner: 16px;
  --tu-global-max-width: 1712px;
  --tu-global-min-width: 600px;
  --tu-global-text-icon-gap: 6px;
  --tu-global-2xl: 16px;
  --tu-global-xl: 12px;
  --tu-global-md: 10px;
  --tu-global-sm: 8px;
  --tu-global-xs: 6px;
  --tu-global-xxs: 4px;
  --tu-global-indent: 40px;
}

@media (max-width: 500px) {
  :root {
    --tu-global-margin-v: 16px;
    --tu-global-margin-h: 16px;
    --tu-global-gap-v: 16px;
    --tu-global-gap-h: 16px;
    --tu-global-corner: 16px;
    --tu-global-max-width: 2000px;
    --tu-global-min-width: 600px;
    --tu-global-text-icon-gap: 6px;
    --tu-global-2xl: 16px;
    --tu-global-xl: 12px;
    --tu-global-md: 10px;
    --tu-global-sm: 8px;
    --tu-global-xs: 6px;
    --tu-global-xxs: 4px;
    --tu-global-indent: 40px;
  }
}
:root {
  --tu-icon-size-xxl: 64px;
  --tu-icon-size-xl: 48px;
  --tu-icon-size-l: 32px;
  --tu-icon-size-m: 24px;
  --tu-icon-size-s: 20px;
  --tu-icon-size-xs: 18px;
  --tu-icon-size-xxs: 16px;
}

@media (max-width: 500px) {
  :root {
    --tu-icon-size-xxl: 64px;
    --tu-icon-size-xl: 48px;
    --tu-icon-size-l: 32px;
    --tu-icon-size-m: 24px;
    --tu-icon-size-s: 20px;
    --tu-icon-size-xs: 18px;
    --tu-icon-size-xxs: 16px;
  }
}
@-webkit-keyframes tu-icon-spin {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes tu-icon-spin {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
tu-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
tu-icon::before {
  --tu-icon-size: var(--tu-icon-size-xl);
  content: "";
  display: block;
  width: var(--tu-icon-size);
  height: var(--tu-icon-size);
}
tu-icon:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/right.svg");
          mask-image: url("./components/icon/svgs/right.svg");
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  background: var(--color-secondary-500);
}
tu-icon[color=original]::before {
  background-image: url("./components/icon/svgs/right.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
tu-icon[size=xxl]::before {
  --tu-icon-size: var(--tu-icon-size-xxl);
}
tu-icon[size=xl]::before {
  --tu-icon-size: var(--tu-icon-size-xl);
}
tu-icon[size=l]::before {
  --tu-icon-size: var(--tu-icon-size-l);
}
tu-icon[size=m]::before {
  --tu-icon-size: var(--tu-icon-size-m);
}
tu-icon[size=s]::before {
  --tu-icon-size: var(--tu-icon-size-s);
}
tu-icon[size=xs]::before {
  --tu-icon-size: var(--tu-icon-size-xs);
}
tu-icon[size=xxs]::before {
  --tu-icon-size: var(--tu-icon-size-xxs);
}
tu-icon[spin=true]::before {
  -webkit-animation: tu-icon-spin 900ms linear infinite;
          animation: tu-icon-spin 900ms linear infinite;
}
tu-icon[instance=left]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/left.svg");
          mask-image: url("./components/icon/svgs/left.svg");
}
tu-icon[instance=left][color=original]::before {
  background-image: url("./components/icon/svgs/left.svg");
}
tu-icon[instance=check]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/check.svg");
          mask-image: url("./components/icon/svgs/check.svg");
}
tu-icon[instance=check][color=original]::before {
  background-image: url("./components/icon/svgs/check.svg");
}
tu-icon[instance=info]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/info.svg");
          mask-image: url("./components/icon/svgs/info.svg");
}
tu-icon[instance=info][color=original]::before {
  background-image: url("./components/icon/svgs/info.svg");
}
tu-icon[instance=minus]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/minus.svg");
          mask-image: url("./components/icon/svgs/minus.svg");
}
tu-icon[instance=minus][color=original]::before {
  background-image: url("./components/icon/svgs/minus.svg");
}
tu-icon[instance=right]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/right.svg");
          mask-image: url("./components/icon/svgs/right.svg");
}
tu-icon[instance=right][color=original]::before {
  background-image: url("./components/icon/svgs/right.svg");
}
tu-icon[instance=calendar]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/calendar.svg");
          mask-image: url("./components/icon/svgs/calendar.svg");
}
tu-icon[instance=calendar][color=original]::before {
  background-image: url("./components/icon/svgs/calendar.svg");
}
tu-icon[instance=clock]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/clock.svg");
          mask-image: url("./components/icon/svgs/clock.svg");
}
tu-icon[instance=clock][color=original]::before {
  background-image: url("./components/icon/svgs/clock.svg");
}
tu-icon[instance=click]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/click.svg");
          mask-image: url("./components/icon/svgs/click.svg");
}
tu-icon[instance=click][color=original]::before {
  background-image: url("./components/icon/svgs/click.svg");
}
tu-icon[instance=up]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/up.svg");
          mask-image: url("./components/icon/svgs/up.svg");
}
tu-icon[instance=up][color=original]::before {
  background-image: url("./components/icon/svgs/up.svg");
}
tu-icon[instance=down]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/down.svg");
          mask-image: url("./components/icon/svgs/down.svg");
}
tu-icon[instance=down][color=original]::before {
  background-image: url("./components/icon/svgs/down.svg");
}
tu-icon[instance=chevron-left]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/chevron-left.svg");
          mask-image: url("./components/icon/svgs/chevron-left.svg");
}
tu-icon[instance=chevron-left][color=original]::before {
  background-image: url("./components/icon/svgs/chevron-left.svg");
}
tu-icon[instance=chevron-right]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/chevron-right.svg");
          mask-image: url("./components/icon/svgs/chevron-right.svg");
}
tu-icon[instance=chevron-right][color=original]::before {
  background-image: url("./components/icon/svgs/chevron-right.svg");
}
tu-icon[instance="teamupdraft-logos/wp-optimize"]:not([color=original])::before {
  -webkit-mask-image: url("./components/icon/svgs/teamupdraft-logos/wp-optimize.svg");
          mask-image: url("./components/icon/svgs/teamupdraft-logos/wp-optimize.svg");
}
tu-icon[instance="teamupdraft-logos/wp-optimize"][color=original]::before {
  background-image: url("./components/icon/svgs/teamupdraft-logos/wp-optimize.svg");
}

:root {
  --tu-button-padding-tert: 2px;
  --tu-button-outline-tert: 2px;
  --tu-button-large-padding-h: 24px;
  --tu-button-large-padding-v: 10px;
  --tu-button-large-min-height: 48px;
  --tu-button-corner: 32px;
  --tu-button-icon-basic-corner: 4px;
  --tu-button-large-gap: 8px;
  --tu-button-large-border: 1px;
  --tu-button-large-outline: 4px;
  --tu-button-medium-padding-h: 24px;
  --tu-button-medium-padding-v: 8px;
  --tu-button-medium-min-height: 40px;
  --tu-button-medium-gap: 8px;
  --tu-button-medium-border: 1px;
  --tu-button-medium-outline: 4px;
  --tu-button-small-padding-h: 16px;
  --tu-button-small-padding-v: 6px;
  --tu-button-small-min-height: 32px;
  --tu-button-small-gap: 6px;
  --tu-button-small-border: 1px;
  --tu-button-small-outline: 4px;
  --tu-button-icon-large-padding: 12px;
  --tu-button-icon-small-padding: 8px;
  --tu-button-icon-corner: 48px;
}

@media (max-width: 500px) {
  :root {
    --tu-button-padding-tert: 2px;
    --tu-button-outline-tert: 2px;
    --tu-button-large-padding-h: 24px;
    --tu-button-large-padding-v: 10px;
    --tu-button-large-min-height: 48px;
    --tu-button-corner: 32px;
    --tu-button-icon-basic-corner: 4px;
    --tu-button-large-gap: 8px;
    --tu-button-large-border: 1px;
    --tu-button-large-outline: 4px;
    --tu-button-medium-padding-h: 24px;
    --tu-button-medium-padding-v: 8px;
    --tu-button-medium-min-height: 40px;
    --tu-button-medium-gap: 8px;
    --tu-button-medium-border: 1px;
    --tu-button-medium-outline: 4px;
    --tu-button-small-padding-h: 16px;
    --tu-button-small-padding-v: 6px;
    --tu-button-small-min-height: 32px;
    --tu-button-small-gap: 6px;
    --tu-button-small-border: 1px;
    --tu-button-small-outline: 4px;
    --tu-button-icon-large-padding: 12px;
    --tu-button-icon-small-padding: 8px;
    --tu-button-icon-corner: 48px;
  }
}
tu-button {
  display: contents;
}
tu-button button {
  --tu-button-icon-size: var(--tu-icon-size-m);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--tu-button-large-gap);
  border: var(--tu-button-large-border) solid transparent;
  border-radius: var(--tu-button-corner);
  min-height: var(--tu-button-large-min-height);
  padding: var(--tu-button-large-padding-v) var(--tu-button-large-padding-h);
  background: var(--color-primary-600);
  cursor: pointer;
  -webkit-transition: background 0.3s, border-color 0.3s, color 0.3s, -webkit-box-shadow 0.3s;
  transition: background 0.3s, border-color 0.3s, color 0.3s, -webkit-box-shadow 0.3s;
  transition: background 0.3s, border-color 0.3s, color 0.3s, box-shadow 0.3s;
  transition: background 0.3s, border-color 0.3s, color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
  color: var(--color-secondary-0);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-button button {
    font-size: 16px;
  }
}
tu-button button {
  font-size: 16px;
}
@media (max-width: 500px) {
  tu-button button {
    font-weight: 500;
  }
}
tu-button button {
  font-weight: 500;
}
@media (max-width: 500px) {
  tu-button button {
    font-style: normal;
  }
}
tu-button button {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-button button {
    line-height: 120%;
  }
}
tu-button button {
  line-height: 120%;
}
@media (max-width: 500px) {
  tu-button button {
    letter-spacing: 0.15px;
  }
}
tu-button button {
  letter-spacing: 0.15px;
}
tu-button button tu-icon::before {
  background: var(--color-secondary-0) !important;
  width: var(--tu-button-icon-size) !important;
  height: var(--tu-button-icon-size) !important;
}
tu-button button[size=xxl] {
  --tu-button-icon-size: var(--tu-icon-size-xxl);
}
tu-button button[size=xl] {
  --tu-button-icon-size: var(--tu-icon-size-xl);
}
tu-button button[size=xs] {
  --tu-button-icon-size: var(--tu-icon-size-xs);
}
tu-button button[size=xxs] {
  --tu-button-icon-size: var(--tu-icon-size-xxs);
}
tu-button button[size=m] {
  --tu-button-icon-size: var(--tu-icon-size-xs);
  gap: var(--tu-button-medium-gap);
  min-height: var(--tu-button-medium-min-height);
  padding: var(--tu-button-medium-padding-v) var(--tu-button-medium-padding-h);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-button button[size=m] {
    font-size: 14px;
  }
}
tu-button button[size=m] {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-button button[size=m] {
    font-weight: 500;
  }
}
tu-button button[size=m] {
  font-weight: 500;
}
@media (max-width: 500px) {
  tu-button button[size=m] {
    font-style: normal;
  }
}
tu-button button[size=m] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-button button[size=m] {
    line-height: 120%;
  }
}
tu-button button[size=m] {
  line-height: 120%;
}
@media (max-width: 500px) {
  tu-button button[size=m] {
    letter-spacing: 0.15px;
  }
}
tu-button button[size=m] {
  letter-spacing: 0.15px;
}
tu-button button[size=s] {
  --tu-button-icon-size: var(--tu-icon-size-xxs);
  gap: var(--tu-button-small-gap);
  min-height: var(--tu-button-small-min-height);
  padding: var(--tu-button-small-padding-v) var(--tu-button-small-padding-h);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-button button[size=s] {
    font-size: 12px;
  }
}
tu-button button[size=s] {
  font-size: 12px;
}
@media (max-width: 500px) {
  tu-button button[size=s] {
    font-weight: 500;
  }
}
tu-button button[size=s] {
  font-weight: 500;
}
@media (max-width: 500px) {
  tu-button button[size=s] {
    font-style: normal;
  }
}
tu-button button[size=s] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-button button[size=s] {
    line-height: 120%;
  }
}
tu-button button[size=s] {
  line-height: 120%;
}
@media (max-width: 500px) {
  tu-button button[size=s] {
    letter-spacing: 0.05px;
  }
}
tu-button button[size=s] {
  letter-spacing: 0.05px;
}
tu-button button:hover {
  background: var(--color-primary-700);
}
tu-button button:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-400);
  background: var(--color-primary-700);
  border-color: transparent;
}
tu-button button[disabled], tu-button button[disabled]:hover, tu-button button[disabled][theme], tu-button button[disabled][theme]:hover {
  background: var(--color-primary-200) !important;
  cursor: not-allowed;
}
tu-button button[disabled][type=tertiary], tu-button button[disabled][type=tertiary]:hover, tu-button button[disabled][type=tertiary][theme], tu-button button[disabled][type=tertiary][theme]:hover {
  color: var(--color-secondary-400) !important;
  background: transparent !important;
  cursor: not-allowed;
  text-decoration: none !important;
}
tu-button button[disabled][type=tertiary] tu-icon::before, tu-button button[disabled][type=tertiary]:hover tu-icon::before, tu-button button[disabled][type=tertiary][theme] tu-icon::before, tu-button button[disabled][type=tertiary][theme]:hover tu-icon::before {
  background: var(--color-secondary-400) !important;
}
tu-button button[disabled][type=icon], tu-button button[disabled][type=icon]:hover, tu-button button[disabled][type=icon][theme], tu-button button[disabled][type=icon][theme]:hover, tu-button button[disabled][type=secondary], tu-button button[disabled][type=secondary]:hover, tu-button button[disabled][type=secondary][theme], tu-button button[disabled][type=secondary][theme]:hover {
  border: var(--tu-button-large-border) solid var(--color-secondary-100) !important;
  background: var(--color-secondary-0) !important;
  color: var(--color-secondary-400) !important;
  cursor: not-allowed;
}
tu-button button[disabled][type=icon] tu-icon::before, tu-button button[disabled][type=icon]:hover tu-icon::before, tu-button button[disabled][type=icon][theme] tu-icon::before, tu-button button[disabled][type=icon][theme]:hover tu-icon::before, tu-button button[disabled][type=secondary] tu-icon::before, tu-button button[disabled][type=secondary]:hover tu-icon::before, tu-button button[disabled][type=secondary][theme] tu-icon::before, tu-button button[disabled][type=secondary][theme]:hover tu-icon::before {
  background: var(--color-secondary-400) !important;
}
tu-button button[type=icon], tu-button button[type=secondary], tu-button button[type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-primary-600);
  color: var(--color-primary-600);
}
tu-button button[type=icon] tu-icon::before, tu-button button[type=secondary] tu-icon::before, tu-button button[type=tertiary] tu-icon::before {
  background: var(--color-primary-600) !important;
}
tu-button button[type=icon]:hover, tu-button button[type=icon]:focus-visible, tu-button button[type=secondary]:hover, tu-button button[type=secondary]:focus-visible, tu-button button[type=tertiary]:hover, tu-button button[type=tertiary]:focus-visible {
  background: var(--color-primary-50);
  color: var(--color-primary-700);
}
tu-button button[type=icon]:hover tu-icon::before, tu-button button[type=icon]:focus-visible tu-icon::before, tu-button button[type=secondary]:hover tu-icon::before, tu-button button[type=secondary]:focus-visible tu-icon::before, tu-button button[type=tertiary]:hover tu-icon::before, tu-button button[type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-primary-700) !important;
}
tu-button button[type=icon]:hover, tu-button button[type=secondary]:hover, tu-button button[type=tertiary]:hover {
  border-color: var(--color-primary-700);
}
tu-button button[type=icon]:focus-visible, tu-button button[type=secondary]:focus-visible, tu-button button[type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[type=tertiary], tu-button button[type=tertiary][theme] {
  border: none;
  padding: 0 var(--tu-button-padding-tert);
  background: transparent !important;
  min-height: unset;
}
tu-button button[type=tertiary]:hover, tu-button button[type=tertiary][theme]:hover {
  text-decoration: underline;
}
tu-button button[type=icon], tu-button button[type=icon][theme], tu-button button[type=icon-basic], tu-button button[type=icon-basic][theme] {
  background: var(--color-primary-50);
  border: none;
  padding: var(--tu-button-icon-large-padding);
  border-radius: var(--tu-button-icon-corner);
  min-height: unset;
}
tu-button button[type=icon] .tu-button-content,
tu-button button[type=icon] tu-icon:not(:first-child), tu-button button[type=icon][theme] .tu-button-content,
tu-button button[type=icon][theme] tu-icon:not(:first-child), tu-button button[type=icon-basic] .tu-button-content,
tu-button button[type=icon-basic] tu-icon:not(:first-child), tu-button button[type=icon-basic][theme] .tu-button-content,
tu-button button[type=icon-basic][theme] tu-icon:not(:first-child) {
  display: none;
}
tu-button button[type=icon]:hover, tu-button button[type=icon][theme]:hover, tu-button button[type=icon-basic]:hover, tu-button button[type=icon-basic][theme]:hover {
  background: var(--color-primary-100);
}
tu-button button[type=icon][disabled], tu-button button[type=icon][disabled]:hover, tu-button button[type=icon][theme][disabled], tu-button button[type=icon][theme][disabled]:hover, tu-button button[type=icon-basic][disabled], tu-button button[type=icon-basic][disabled]:hover, tu-button button[type=icon-basic][theme][disabled], tu-button button[type=icon-basic][theme][disabled]:hover {
  background: var(--color-secondary-50) !important;
  border: none !important;
}
tu-button button[type=icon]:not([size]), tu-button button[type=icon][size=l], tu-button button[type=icon-basic]:not([size]), tu-button button[type=icon-basic][size=l] {
  --tu-button-icon-size: var(--tu-icon-size-l);
}
tu-button button[type=icon][size=m], tu-button button[type=icon-basic][size=m] {
  --tu-button-icon-size: var(--tu-icon-size-m);
}
tu-button button[type=icon][size=s], tu-button button[type=icon-basic][size=s] {
  --tu-button-icon-size: var(--tu-icon-size-s);
}
tu-button button[type=icon-basic] {
  padding: 0;
  border-radius: var(--tu-button-icon-basic-corner);
  background: transparent;
  color: var(--color-secondary-500);
}
tu-button button[type=icon-basic]:hover {
  background: transparent;
}
tu-button button[type=icon-basic] tu-icon::before {
  background: var(--color-secondary-500) !important;
}
tu-button button[theme=primary][disabled][type=cta], tu-button button[theme=primary][disabled][type=cta]:hover {
  background: var(--color-primary-200);
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=primary][type=cta] {
  background: var(--color-primary-600);
  color: var(--color-secondary-0);
  border-color: var(--color-primary-600);
}
tu-button button[theme=primary][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=primary][type=cta]:hover, tu-button button[theme=primary][type=cta]:focus-visible {
  background: var(--color-primary-700);
  border-color: var(--color-primary-700);
}
tu-button button[theme=primary][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[theme=primary][type=icon], tu-button button[theme=primary][type=secondary], tu-button button[theme=primary][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-primary-600);
  color: var(--color-primary-600);
}
tu-button button[theme=primary][type=icon] tu-icon::before, tu-button button[theme=primary][type=secondary] tu-icon::before, tu-button button[theme=primary][type=tertiary] tu-icon::before {
  background: var(--color-primary-600) !important;
}
tu-button button[theme=primary][type=icon]:hover, tu-button button[theme=primary][type=icon]:focus-visible, tu-button button[theme=primary][type=secondary]:hover, tu-button button[theme=primary][type=secondary]:focus-visible, tu-button button[theme=primary][type=tertiary]:hover, tu-button button[theme=primary][type=tertiary]:focus-visible {
  background: var(--color-primary-50);
  color: var(--color-primary-700);
}
tu-button button[theme=primary][type=icon]:hover tu-icon::before, tu-button button[theme=primary][type=icon]:focus-visible tu-icon::before, tu-button button[theme=primary][type=secondary]:hover tu-icon::before, tu-button button[theme=primary][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=primary][type=tertiary]:hover tu-icon::before, tu-button button[theme=primary][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-primary-700) !important;
}
tu-button button[theme=primary][type=icon]:hover, tu-button button[theme=primary][type=secondary]:hover, tu-button button[theme=primary][type=tertiary]:hover {
  border-color: var(--color-primary-700);
}
tu-button button[theme=primary][type=icon]:focus-visible, tu-button button[theme=primary][type=secondary]:focus-visible, tu-button button[theme=primary][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[theme=primary][type=icon] {
  border: none;
  background: var(--color-primary-50);
}
tu-button button[theme=primary][type=icon] tu-icon::before {
  background: !important;
}
tu-button button[theme=primary][type=icon]:focus-visible tu-icon::before {
  background: !important;
}
tu-button button[theme=primary][type=icon]:hover {
  background: var(--color-primary-100);
}
tu-button button[theme=primary][type=icon]:hover tu-icon::before {
  background: !important;
}
tu-button button[theme=error][disabled][type=cta], tu-button button[theme=error][disabled][type=cta]:hover {
  background: var(--color-status-error-200);
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=error][type=cta] {
  background: var(--color-status-error-600);
  color: var(--color-secondary-0);
  border-color: var(--color-status-error-600);
}
tu-button button[theme=error][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=error][type=cta]:hover, tu-button button[theme=error][type=cta]:focus-visible {
  background: var(--color-status-error-700);
  border-color: var(--color-status-error-700);
}
tu-button button[theme=error][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-error-200);
}
tu-button button[theme=error][type=icon], tu-button button[theme=error][type=secondary], tu-button button[theme=error][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-status-error-600);
  color: var(--color-status-error-600);
}
tu-button button[theme=error][type=icon] tu-icon::before, tu-button button[theme=error][type=secondary] tu-icon::before, tu-button button[theme=error][type=tertiary] tu-icon::before {
  background: var(--color-status-error-600) !important;
}
tu-button button[theme=error][type=icon]:hover, tu-button button[theme=error][type=icon]:focus-visible, tu-button button[theme=error][type=secondary]:hover, tu-button button[theme=error][type=secondary]:focus-visible, tu-button button[theme=error][type=tertiary]:hover, tu-button button[theme=error][type=tertiary]:focus-visible {
  background: var(--color-status-error-50);
  color: var(--color-status-error-700);
}
tu-button button[theme=error][type=icon]:hover tu-icon::before, tu-button button[theme=error][type=icon]:focus-visible tu-icon::before, tu-button button[theme=error][type=secondary]:hover tu-icon::before, tu-button button[theme=error][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=error][type=tertiary]:hover tu-icon::before, tu-button button[theme=error][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-status-error-700) !important;
}
tu-button button[theme=error][type=icon]:hover, tu-button button[theme=error][type=secondary]:hover, tu-button button[theme=error][type=tertiary]:hover {
  border-color: var(--color-status-error-700);
}
tu-button button[theme=error][type=icon]:focus-visible, tu-button button[theme=error][type=secondary]:focus-visible, tu-button button[theme=error][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-error-200);
}
tu-button button[theme=error][type=icon] {
  border: none;
  background: var(--color-status-error-50);
}
tu-button button[theme=error][type=icon] tu-icon::before {
  background: !important;
}
tu-button button[theme=error][type=icon]:focus-visible tu-icon::before {
  background: !important;
}
tu-button button[theme=error][type=icon]:hover {
  background: var(--color-status-error-100);
}
tu-button button[theme=error][type=icon]:hover tu-icon::before {
  background: !important;
}
tu-button button[theme=info][disabled][type=cta], tu-button button[theme=info][disabled][type=cta]:hover {
  background: var(--color-status-info-200);
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=info][type=cta] {
  background: var(--color-status-info-600);
  color: var(--color-secondary-0);
  border-color: var(--color-status-info-600);
}
tu-button button[theme=info][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=info][type=cta]:hover, tu-button button[theme=info][type=cta]:focus-visible {
  background: var(--color-status-info-700);
  border-color: var(--color-status-info-700);
}
tu-button button[theme=info][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-info-200);
}
tu-button button[theme=info][type=icon], tu-button button[theme=info][type=secondary], tu-button button[theme=info][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-status-info-600);
  color: var(--color-status-info-600);
}
tu-button button[theme=info][type=icon] tu-icon::before, tu-button button[theme=info][type=secondary] tu-icon::before, tu-button button[theme=info][type=tertiary] tu-icon::before {
  background: var(--color-status-info-600) !important;
}
tu-button button[theme=info][type=icon]:hover, tu-button button[theme=info][type=icon]:focus-visible, tu-button button[theme=info][type=secondary]:hover, tu-button button[theme=info][type=secondary]:focus-visible, tu-button button[theme=info][type=tertiary]:hover, tu-button button[theme=info][type=tertiary]:focus-visible {
  background: var(--color-status-info-50);
  color: var(--color-status-info-700);
}
tu-button button[theme=info][type=icon]:hover tu-icon::before, tu-button button[theme=info][type=icon]:focus-visible tu-icon::before, tu-button button[theme=info][type=secondary]:hover tu-icon::before, tu-button button[theme=info][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=info][type=tertiary]:hover tu-icon::before, tu-button button[theme=info][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-status-info-700) !important;
}
tu-button button[theme=info][type=icon]:hover, tu-button button[theme=info][type=secondary]:hover, tu-button button[theme=info][type=tertiary]:hover {
  border-color: var(--color-status-info-700);
}
tu-button button[theme=info][type=icon]:focus-visible, tu-button button[theme=info][type=secondary]:focus-visible, tu-button button[theme=info][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-info-200);
}
tu-button button[theme=info][type=icon] {
  border: none;
  background: var(--color-status-info-50);
}
tu-button button[theme=info][type=icon] tu-icon::before {
  background: !important;
}
tu-button button[theme=info][type=icon]:focus-visible tu-icon::before {
  background: !important;
}
tu-button button[theme=info][type=icon]:hover {
  background: var(--color-status-info-100);
}
tu-button button[theme=info][type=icon]:hover tu-icon::before {
  background: !important;
}
tu-button button[theme=success][disabled][type=cta], tu-button button[theme=success][disabled][type=cta]:hover {
  background: var(--color-status-success-200);
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=success][type=cta] {
  background: var(--color-status-success-600);
  color: var(--color-secondary-0);
  border-color: var(--color-status-success-600);
}
tu-button button[theme=success][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=success][type=cta]:hover, tu-button button[theme=success][type=cta]:focus-visible {
  background: var(--color-status-success-700);
  border-color: var(--color-status-success-700);
}
tu-button button[theme=success][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-success-200);
}
tu-button button[theme=success][type=icon], tu-button button[theme=success][type=secondary], tu-button button[theme=success][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-status-success-600);
  color: var(--color-status-success-600);
}
tu-button button[theme=success][type=icon] tu-icon::before, tu-button button[theme=success][type=secondary] tu-icon::before, tu-button button[theme=success][type=tertiary] tu-icon::before {
  background: var(--color-status-success-600) !important;
}
tu-button button[theme=success][type=icon]:hover, tu-button button[theme=success][type=icon]:focus-visible, tu-button button[theme=success][type=secondary]:hover, tu-button button[theme=success][type=secondary]:focus-visible, tu-button button[theme=success][type=tertiary]:hover, tu-button button[theme=success][type=tertiary]:focus-visible {
  background: var(--color-status-success-50);
  color: var(--color-status-success-700);
}
tu-button button[theme=success][type=icon]:hover tu-icon::before, tu-button button[theme=success][type=icon]:focus-visible tu-icon::before, tu-button button[theme=success][type=secondary]:hover tu-icon::before, tu-button button[theme=success][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=success][type=tertiary]:hover tu-icon::before, tu-button button[theme=success][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-status-success-700) !important;
}
tu-button button[theme=success][type=icon]:hover, tu-button button[theme=success][type=secondary]:hover, tu-button button[theme=success][type=tertiary]:hover {
  border-color: var(--color-status-success-700);
}
tu-button button[theme=success][type=icon]:focus-visible, tu-button button[theme=success][type=secondary]:focus-visible, tu-button button[theme=success][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-success-200);
}
tu-button button[theme=success][type=icon] {
  border: none;
  background: var(--color-status-success-50);
}
tu-button button[theme=success][type=icon] tu-icon::before {
  background: !important;
}
tu-button button[theme=success][type=icon]:focus-visible tu-icon::before {
  background: !important;
}
tu-button button[theme=success][type=icon]:hover {
  background: var(--color-status-success-100);
}
tu-button button[theme=success][type=icon]:hover tu-icon::before {
  background: !important;
}
tu-button button[theme=warning][disabled][type=cta], tu-button button[theme=warning][disabled][type=cta]:hover {
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=warning][type=cta] {
  background: var(--color-status-warning-600);
  color: var(--color-secondary-0);
  border-color: var(--color-status-warning-600);
}
tu-button button[theme=warning][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=warning][type=cta]:hover, tu-button button[theme=warning][type=cta]:focus-visible {
  background: var(--color-status-warning-700);
  border-color: var(--color-status-warning-700);
}
tu-button button[theme=warning][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-warning-200);
}
tu-button button[theme=warning][type=icon], tu-button button[theme=warning][type=secondary], tu-button button[theme=warning][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-status-warning-600);
  color: var(--color-status-warning-600);
}
tu-button button[theme=warning][type=icon] tu-icon::before, tu-button button[theme=warning][type=secondary] tu-icon::before, tu-button button[theme=warning][type=tertiary] tu-icon::before {
  background: var(--color-status-warning-600) !important;
}
tu-button button[theme=warning][type=icon]:hover, tu-button button[theme=warning][type=icon]:focus-visible, tu-button button[theme=warning][type=secondary]:hover, tu-button button[theme=warning][type=secondary]:focus-visible, tu-button button[theme=warning][type=tertiary]:hover, tu-button button[theme=warning][type=tertiary]:focus-visible {
  color: var(--color-status-warning-700);
}
tu-button button[theme=warning][type=icon]:hover tu-icon::before, tu-button button[theme=warning][type=icon]:focus-visible tu-icon::before, tu-button button[theme=warning][type=secondary]:hover tu-icon::before, tu-button button[theme=warning][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=warning][type=tertiary]:hover tu-icon::before, tu-button button[theme=warning][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-status-warning-700) !important;
}
tu-button button[theme=warning][type=icon]:hover, tu-button button[theme=warning][type=secondary]:hover, tu-button button[theme=warning][type=tertiary]:hover {
  border-color: var(--color-status-warning-700);
}
tu-button button[theme=warning][type=icon]:focus-visible, tu-button button[theme=warning][type=secondary]:focus-visible, tu-button button[theme=warning][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-status-warning-200);
}
tu-button button[theme=warning][type=icon] {
  border: none;
  background: var(--color-status-warning-50);
}
tu-button button[theme=warning][type=icon] tu-icon::before {
  background: !important;
}
tu-button button[theme=warning][type=icon]:focus-visible tu-icon::before {
  background: !important;
}
tu-button button[theme=warning][type=icon]:hover {
  background: var(--color-status-warning-100);
}
tu-button button[theme=warning][type=icon]:hover tu-icon::before {
  background: !important;
}
tu-button button[theme=premium][disabled][type=cta], tu-button button[theme=premium][disabled][type=cta]:hover {
  background: var(--color-primary-200);
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=premium][type=cta] {
  background: var(--color-premium-gradient);
  color: var(--color-secondary-0);
  border: none;
  -webkit-font-smoothing: antialiased;
}
tu-button button[theme=premium][type=cta]:hover, tu-button button[theme=premium][type=cta]:focus-visible {
  background: var(--color-premium-gradient-dark);
}
tu-button button[theme=premium][type=secondary], tu-button button[theme=premium][type=tertiary] {
  position: relative;
  z-index: 1;
  border: var(--tu-button-large-border) solid transparent;
  border-radius: var(--tu-button-corner);
  background-image: var(--color-premium-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
tu-button button[theme=premium][type=secondary] tu-icon::before, tu-button button[theme=premium][type=tertiary] tu-icon::before {
  background: var(--color-premium-gradient) !important;
}
tu-button button[theme=premium][type=secondary]::before, tu-button button[theme=premium][type=tertiary]::before {
  content: "";
  position: absolute;
  inset: calc(-1 * var(--tu-button-large-border));
  z-index: -1;
  border-radius: inherit;
  padding: var(--tu-button-large-border);
  background: var(--color-premium-gradient);
  mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, var(--color-secondary-0))) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, var(--color-secondary-0)));
  mask: linear-gradient(var(--color-secondary-0) 0 0) content-box, linear-gradient(var(--color-secondary-0) 0 0);
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, var(--color-secondary-0))) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, var(--color-secondary-0)));
  -webkit-mask: linear-gradient(var(--color-secondary-0) 0 0) content-box, linear-gradient(var(--color-secondary-0) 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
tu-button button[theme=premium][type=secondary]::after, tu-button button[theme=premium][type=tertiary]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  border-radius: inherit;
  background: transparent;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}
tu-button button[theme=premium][type=secondary][disabled]::before, tu-button button[theme=premium][type=secondary][disabled]:hover::before, tu-button button[theme=premium][type=tertiary][disabled]::before, tu-button button[theme=premium][type=tertiary][disabled]:hover::before {
  background: var(--color-secondary-100);
}
tu-button button[theme=premium][type=secondary]:hover, tu-button button[theme=premium][type=secondary]:focus-visible, tu-button button[theme=premium][type=tertiary]:hover, tu-button button[theme=premium][type=tertiary]:focus-visible {
  background-image: var(--color-premium-gradient-dark), var(--color-premium-gradient-light);
  background-clip: text, padding-box;
  color: transparent;
}
tu-button button[theme=premium][type=secondary]:hover tu-icon::before, tu-button button[theme=premium][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=premium][type=tertiary]:hover tu-icon::before, tu-button button[theme=premium][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-premium-gradient-dark) !important;
}
tu-button button[theme=premium][type=secondary]:hover::before, tu-button button[theme=premium][type=secondary]:focus-visible::before, tu-button button[theme=premium][type=tertiary]:hover::before, tu-button button[theme=premium][type=tertiary]:focus-visible::before {
  background: var(--color-premium-gradient-dark);
}
tu-button button[theme=premium][type=secondary]:hover::after, tu-button button[theme=premium][type=secondary]:focus-visible::after, tu-button button[theme=premium][type=tertiary]:hover::after, tu-button button[theme=premium][type=tertiary]:focus-visible::after {
  display: none;
}
tu-button button[theme=white][disabled][type=cta], tu-button button[theme=white][disabled][type=cta]:hover {
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=white][type=cta] {
  background: var(--color-secondary-0);
  color: var(--color-secondary-0);
  border-color: var(--color-secondary-0);
}
tu-button button[theme=white][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=white][type=cta]:hover, tu-button button[theme=white][type=cta]:focus-visible {
  background: var(--color-primary-300);
  border-color: var(--color-primary-300);
}
tu-button button[theme=white][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[theme=white][type=icon], tu-button button[theme=white][type=secondary], tu-button button[theme=white][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-secondary-0);
  color: var(--color-secondary-0);
}
tu-button button[theme=white][type=icon] tu-icon::before, tu-button button[theme=white][type=secondary] tu-icon::before, tu-button button[theme=white][type=tertiary] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=white][type=icon]:hover, tu-button button[theme=white][type=icon]:focus-visible, tu-button button[theme=white][type=secondary]:hover, tu-button button[theme=white][type=secondary]:focus-visible, tu-button button[theme=white][type=tertiary]:hover, tu-button button[theme=white][type=tertiary]:focus-visible {
  color: var(--color-primary-300);
}
tu-button button[theme=white][type=icon]:hover tu-icon::before, tu-button button[theme=white][type=icon]:focus-visible tu-icon::before, tu-button button[theme=white][type=secondary]:hover tu-icon::before, tu-button button[theme=white][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=white][type=tertiary]:hover tu-icon::before, tu-button button[theme=white][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-primary-300) !important;
}
tu-button button[theme=white][type=icon]:hover, tu-button button[theme=white][type=secondary]:hover, tu-button button[theme=white][type=tertiary]:hover {
  border-color: var(--color-primary-300);
}
tu-button button[theme=white][type=icon]:focus-visible, tu-button button[theme=white][type=secondary]:focus-visible, tu-button button[theme=white][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[theme=white][type=icon] {
  border: none;
  background: var(--color-secondary-0);
}
tu-button button[theme=white][type=icon] tu-icon::before {
  background: var(--color-secondary-500) !important;
}
tu-button button[theme=white][type=icon]:focus-visible tu-icon::before {
  background: var(--color-secondary-500) !important;
}
tu-button button[theme=white][type=icon]:hover {
  background: var(--color-secondary-50);
}
tu-button button[theme=white][type=icon]:hover tu-icon::before {
  background: var(--color-secondary-500) !important;
}
tu-button button[theme=grey][disabled][type=cta], tu-button button[theme=grey][disabled][type=cta]:hover {
  border: none;
  cursor: not-allowed;
}
tu-button button[theme=grey][type=cta] {
  background: var(--color-secondary-600);
  color: var(--color-secondary-0);
  border-color: var(--color-secondary-600);
}
tu-button button[theme=grey][type=cta] tu-icon::before {
  background: var(--color-secondary-0) !important;
}
tu-button button[theme=grey][type=cta]:hover, tu-button button[theme=grey][type=cta]:focus-visible {
  background: var(--color-secondary-800);
  border-color: var(--color-secondary-800);
}
tu-button button[theme=grey][type=cta]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[theme=grey][type=icon], tu-button button[theme=grey][type=secondary], tu-button button[theme=grey][type=tertiary] {
  background: var(--color-secondary-0);
  border-color: var(--color-secondary-600);
  color: var(--color-secondary-600);
}
tu-button button[theme=grey][type=icon] tu-icon::before, tu-button button[theme=grey][type=secondary] tu-icon::before, tu-button button[theme=grey][type=tertiary] tu-icon::before {
  background: var(--color-secondary-600) !important;
}
tu-button button[theme=grey][type=icon]:hover, tu-button button[theme=grey][type=icon]:focus-visible, tu-button button[theme=grey][type=secondary]:hover, tu-button button[theme=grey][type=secondary]:focus-visible, tu-button button[theme=grey][type=tertiary]:hover, tu-button button[theme=grey][type=tertiary]:focus-visible {
  color: var(--color-secondary-800);
}
tu-button button[theme=grey][type=icon]:hover tu-icon::before, tu-button button[theme=grey][type=icon]:focus-visible tu-icon::before, tu-button button[theme=grey][type=secondary]:hover tu-icon::before, tu-button button[theme=grey][type=secondary]:focus-visible tu-icon::before, tu-button button[theme=grey][type=tertiary]:hover tu-icon::before, tu-button button[theme=grey][type=tertiary]:focus-visible tu-icon::before {
  background: var(--color-secondary-800) !important;
}
tu-button button[theme=grey][type=icon]:hover, tu-button button[theme=grey][type=secondary]:hover, tu-button button[theme=grey][type=tertiary]:hover {
  border-color: var(--color-secondary-800);
}
tu-button button[theme=grey][type=icon]:focus-visible, tu-button button[theme=grey][type=secondary]:focus-visible, tu-button button[theme=grey][type=tertiary]:focus-visible {
  outline: var(--tu-button-large-outline) solid var(--color-primary-300);
}
tu-button button[theme=grey][type=icon] {
  border: none;
}
tu-button button[theme=grey][type=icon] tu-icon::before {
  background: !important;
}
tu-button button[theme=grey][type=icon]:focus-visible tu-icon::before {
  background: !important;
}
tu-button button[theme=grey][type=icon]:hover tu-icon::before {
  background: !important;
}

body:has(tu-admin-page) #wpwrap {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  overflow: hidden;
  background: var(--color-secondary-50);
}
body:has(tu-admin-page) #wpcontent {
  padding-left: 0px;
}
body:has(tu-admin-page) #wpbody-content {
  padding: 0px;
}
body:has(tu-admin-page) #wpbody-content .wrap {
  margin: 0px;
}
body:has(tu-admin-page) #wpfooter {
  position: relative;
  margin-left: 0;
}

tu-admin-page {
  width: 100%;
  padding: var(--tu-global-margin-v) var(--tu-global-margin-h);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--color-secondary-50);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--tu-global-gap-v);
}

tu-plugin-content {
  width: 100%;
  padding: var(--tu-global-margin-v) var(--tu-global-margin-h);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--color-secondary-0);
  border-radius: var(--tu-global-corner);
  max-width: var(--tu-global-max-width);
}
tu-plugin-content[layout=a] {
  max-width: 1712px;
}
tu-plugin-content[layout=b] {
  max-width: 1250px;
}
tu-plugin-content[layout=c] {
  max-width: 1411px;
}
tu-plugin-content[layout=d] {
  max-width: 949px;
}

:root {
  --tu-top-nav-gap-v: 12px;
  --tu-top-nav-title-gap-h: 6px;
  --tu-top-nav-tabs-border: 4px;
  --tu-top-nav-tabs-gap-h: 4px;
  --tu-top-nav-tab-padding-h: 12px;
  --tu-top-nav-tab-padding-v: 2px;
  --tu-top-nav-tab-gap-v: 2px;
  --tu-top-nav-corner: 8px;
  --tu-top-nav-tab-outline: 2px;
}

@media (max-width: 500px) {
  :root {
    --tu-top-nav-gap-v: 12px;
    --tu-top-nav-title-gap-h: 6px;
    --tu-top-nav-tabs-border: 4px;
    --tu-top-nav-tabs-gap-h: 4px;
    --tu-top-nav-tab-padding-h: 12px;
    --tu-top-nav-tab-padding-v: 2px;
    --tu-top-nav-tab-gap-v: 2px;
    --tu-top-nav-corner: 8px;
    --tu-top-nav-tab-outline: 2px;
  }
}
tu-top-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: var(--tu-top-nav-gap-v);
}
tu-top-nav tu-top-nav-title-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: var(--tu-top-nav-title-gap-h);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-title-container {
    font-size: 24px;
  }
}
tu-top-nav tu-top-nav-title-container {
  font-size: 24px;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-title-container {
    font-weight: 600;
  }
}
tu-top-nav tu-top-nav-title-container {
  font-weight: 600;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-title-container {
    font-style: normal;
  }
}
tu-top-nav tu-top-nav-title-container {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-title-container {
    line-height: 130%;
  }
}
tu-top-nav tu-top-nav-title-container {
  line-height: 130%;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-title-container {
    letter-spacing: 0;
  }
}
tu-top-nav tu-top-nav-title-container {
  letter-spacing: 0;
}
tu-top-nav tu-top-nav-tabs-container {
  padding: var(--tu-top-nav-tabs-border);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: var(--tu-top-nav-tabs-gap-h);
  border-radius: var(--tu-global-md);
  background: var(--color-secondary-800);
}
tu-top-nav tu-top-nav-tab[active] button {
  background: var(--color-primary-600);
}
tu-top-nav tu-top-nav-tab[active] button:hover {
  background: var(--color-primary-700);
}
tu-top-nav tu-top-nav-tab button {
  cursor: pointer;
  color: var(--color-secondary-0);
  padding: var(--tu-top-nav-tab-padding-v) var(--tu-top-nav-tab-padding-h);
  border-radius: var(--tu-top-nav-corner);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-tab button {
    font-size: 14px;
  }
}
tu-top-nav tu-top-nav-tab button {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-tab button {
    font-weight: 400;
  }
}
tu-top-nav tu-top-nav-tab button {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-tab button {
    font-style: normal;
  }
}
tu-top-nav tu-top-nav-tab button {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-tab button {
    line-height: 140%;
  }
}
tu-top-nav tu-top-nav-tab button {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-top-nav tu-top-nav-tab button {
    letter-spacing: 0.15px;
  }
}
tu-top-nav tu-top-nav-tab button {
  letter-spacing: 0.15px;
  background: transparent;
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
tu-top-nav tu-top-nav-tab button tu-icon::before {
  background: var(--color-secondary-0) !important;
  width: var(--tu-icon-size-m) !important;
  height: var(--tu-icon-size-m) !important;
}
tu-top-nav tu-top-nav-tab button:hover {
  background: var(--color-secondary-900);
}
tu-top-nav tu-top-nav-tab button:focus-visible {
  outline: var(--tu-top-nav-tab-outline) solid var(--color-primary-300);
}

tu-top-nav-content {
  display: contents;
}
tu-top-nav-content tu-top-nav-content-tab {
  display: none;
}
tu-top-nav-content tu-top-nav-content-tab[active] {
  display: contents;
}

:root {
  --tu-side-nav-gap-v: 12px;
  --tu-side-nav-gap-div: 12px;
  --tu-side-nav-item-padding-h: 16px;
  --tu-side-nav-item-padding-v: 12px;
  --tu-side-nav-item-gap-h: 8px;
  --tu-side-nav-item-content-gap-v: 4px;
  --tu-side-nav-item-corner: 8px;
  --tu-side-nav-item-outline: 2px;
}

@media (max-width: 500px) {
  :root {
    --tu-side-nav-gap-v: 12px;
    --tu-side-nav-gap-div: 12px;
    --tu-side-nav-item-padding-h: 16px;
    --tu-side-nav-item-padding-v: 12px;
    --tu-side-nav-item-gap-h: 8px;
    --tu-side-nav-item-content-gap-v: 4px;
    --tu-side-nav-item-corner: 8px;
    --tu-side-nav-item-outline: 2px;
  }
}
tu-side-nav {
  height: 100%;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: var(--tu-side-nav-gap-div);
}
tu-side-nav tu-side-nav-items-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: var(--tu-side-nav-gap-v);
}
tu-side-nav tu-side-nav-item[active] button {
  background: var(--color-secondary-50);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
tu-side-nav tu-side-nav-item[active] button tu-icon::before {
  background: var(--color-secondary-900) !important;
}
tu-side-nav tu-side-nav-item[active] button .tu-side-nav-item-content-description {
  display: block;
}
tu-side-nav tu-side-nav-item[active] button:hover {
  background: var(--color-secondary-100);
}
tu-side-nav tu-side-nav-item button {
  width: 100%;
  cursor: pointer;
  padding: var(--tu-side-nav-item-padding-v) var(--tu-side-nav-item-padding-h);
  border-radius: var(--tu-side-nav-item-corner);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-side-nav tu-side-nav-item button {
    font-size: 14px;
  }
}
tu-side-nav tu-side-nav-item button {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-side-nav tu-side-nav-item button {
    font-weight: 400;
  }
}
tu-side-nav tu-side-nav-item button {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-side-nav tu-side-nav-item button {
    font-style: normal;
  }
}
tu-side-nav tu-side-nav-item button {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-side-nav tu-side-nav-item button {
    line-height: 140%;
  }
}
tu-side-nav tu-side-nav-item button {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-side-nav tu-side-nav-item button {
    letter-spacing: 0.15px;
  }
}
tu-side-nav tu-side-nav-item button {
  letter-spacing: 0.15px;
  background: transparent;
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: var(--tu-side-nav-item-gap-h);
  color: var(--color-secondary-900);
}
tu-side-nav tu-side-nav-item button tu-icon::before {
  background: var(--color-secondary-500) !important;
  width: var(--tu-icon-size-m) !important;
  height: var(--tu-icon-size-m) !important;
}
tu-side-nav tu-side-nav-item button:hover {
  background: var(--color-secondary-50);
}
tu-side-nav tu-side-nav-item button:focus-visible {
  outline: var(--tu-side-nav-item-outline) solid var(--color-primary-300);
}
tu-side-nav tu-side-nav-item button .tu-side-nav-item-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-side-nav-item-content-gap-v);
}
tu-side-nav tu-side-nav-item button .tu-side-nav-item-content-description {
  display: none;
  color: var(--color-secondary-800);
}

tu-side-nav-content {
  display: contents;
}
tu-side-nav-content tu-side-nav-content-item {
  display: none;
}
tu-side-nav-content tu-side-nav-content-item[active] {
  display: contents;
}

tu-divider {
  display: block;
  width: 1px;
  height: 100%;
  background: var(--color-secondary-100);
}

tu-divider[orientation=horizontal] {
  width: 100%;
  height: 1px;
}

:root {
  --tu-header-and-text-gap-v: 2px;
  --tu-header-and-text-title-gap-h: 6px;
}

@media (max-width: 500px) {
  :root {
    --tu-header-and-text-gap-v: 2px;
    --tu-header-and-text-title-gap-h: 6px;
  }
}
tu-header-and-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-header-and-text-gap-v);
  width: 100%;
}

tu-header-and-text-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: var(--tu-header-and-text-title-gap-h);
  color: var(--color-secondary-900);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-header-and-text-title {
    font-size: 16px;
  }
}
tu-header-and-text-title {
  font-size: 16px;
}
@media (max-width: 500px) {
  tu-header-and-text-title {
    font-weight: 600;
  }
}
tu-header-and-text-title {
  font-weight: 600;
}
@media (max-width: 500px) {
  tu-header-and-text-title {
    font-style: normal;
  }
}
tu-header-and-text-title {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-header-and-text-title {
    line-height: 130%;
  }
}
tu-header-and-text-title {
  line-height: 130%;
}
@media (max-width: 500px) {
  tu-header-and-text-title {
    letter-spacing: 0;
  }
}
tu-header-and-text-title {
  letter-spacing: 0;
}

tu-header-and-text-description {
  color: var(--color-secondary-600);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-header-and-text-description {
    font-size: 14px;
  }
}
tu-header-and-text-description {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-header-and-text-description {
    font-weight: 400;
  }
}
tu-header-and-text-description {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-header-and-text-description {
    font-style: normal;
  }
}
tu-header-and-text-description {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-header-and-text-description {
    line-height: 140%;
  }
}
tu-header-and-text-description {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-header-and-text-description {
    letter-spacing: 0.15px;
  }
}
tu-header-and-text-description {
  letter-spacing: 0.15px;
}

:root {
  --tu-side-card-padding-h: 16px;
  --tu-side-card-padding-v: 16px;
  --tu-side-card-gap-v: 16px;
  --tu-side-card-corner: 16px;
  --tu-side-card-width: 300px;
}

@media (max-width: 500px) {
  :root {
    --tu-side-card-padding-h: 16px;
    --tu-side-card-padding-v: 16px;
    --tu-side-card-gap-v: 16px;
    --tu-side-card-corner: 16px;
    --tu-side-card-width: 430px;
  }
}
:root {
  --tu-card-padding-h: 24px;
  --tu-card-padding-v: 24px;
  --tu-card-gap-v: 24px;
  --tu-card-corner: 16px;
  --tu-card-padding-v-head: 16px;
  --tu-card-max-width: 900px;
  --tu-card-header-contents-gap-h: 8px;
}

@media (max-width: 500px) {
  :root {
    --tu-card-padding-h: 24px;
    --tu-card-padding-v: 24px;
    --tu-card-gap-v: 16px;
    --tu-card-corner: 16px;
    --tu-card-padding-v-head: 16px;
    --tu-card-max-width: 901px;
    --tu-card-header-contents-gap-h: 8px;
  }
}
tu-card,
tu-card-header-wrapper {
  display: block;
}

tu-card {
  border: 1px solid var(--color-secondary-100);
  border-radius: var(--tu-card-corner);
  overflow: visible;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-card {
    font-size: 16px;
  }
}
tu-card {
  font-size: 16px;
}
@media (max-width: 500px) {
  tu-card {
    font-weight: 500;
  }
}
tu-card {
  font-weight: 500;
}
@media (max-width: 500px) {
  tu-card {
    font-style: normal;
  }
}
tu-card {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-card {
    line-height: 140%;
  }
}
tu-card {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-card {
    letter-spacing: 0.15px;
  }
}
tu-card {
  letter-spacing: 0.15px;
}
tu-card[collapsed=true] tu-card-container,
tu-card[collapsed=true] tu-card-container-slot {
  display: none;
}
tu-card[collapsed=true] tu-card-header-wrapper {
  border: none;
}
tu-card tu-card-container-slot {
  gap: var(--tu-card-gap-v);
}
tu-card tu-card-container-slot[divider=false] .tu-card-divider {
  display: none;
}

tu-card-header-wrapper {
  border-radius: var(--tu-card-corner) var(--tu-card-corner) 0 0;
  padding: var(--tu-card-padding-v-head) var(--tu-card-padding-h);
  background: var(--color-secondary-20);
  border-bottom: 1px solid var(--color-secondary-100);
}

tu-card-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: var(--tu-card-header-contents-gap-h);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
}
tu-card-header tu-card-collapse-button {
  -ms-flex-item-align: center;
      align-self: center;
}

tu-card-container {
  border-radius: 0 0 var(--tu-card-corner) var(--tu-card-corner);
  padding: var(--tu-card-padding-v) var(--tu-card-padding-h);
  background: var(--color-secondary-0);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-card-gap-v);
}

tu-card-container-slot {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
tu-card-container-slot:last-of-type .tu-card-divider {
  display: none;
}

tu-side-card tu-card {
  padding: var(--tu-side-card-padding-v) var(--tu-side-card-padding-h);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-side-card-gap-v);
  border: 1px solid var(--color-status-info-100);
  background: var(--color-status-info-50);
}
tu-side-card tu-card-container-slot {
  gap: var(--tu-side-card-gap-v);
}
tu-side-card[theme=help] tu-card {
  background: var(--color-status-info-50);
  border-color: var(--color-status-info-100);
}
tu-side-card[theme=blog] tu-card {
  background: #F2F1F8;
  border-color: #E6E2FF;
}
tu-side-card[theme=premium] tu-card {
  background: var(--color-primary-50);
  border-color: var(--color-primary-100);
}

tu-label-chip {
  padding: 0 6px;
  background: var(--color-secondary-0);
  border: 1px solid var(--color-secondary-200);
  border-radius: 6px;
  color: var(--color-secondary-700);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-label-chip {
    font-size: 20px;
  }
}
tu-label-chip {
  font-size: 20px;
}
@media (max-width: 500px) {
  tu-label-chip {
    font-weight: 600;
  }
}
tu-label-chip {
  font-weight: 600;
}
@media (max-width: 500px) {
  tu-label-chip {
    font-style: normal;
  }
}
tu-label-chip {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-label-chip {
    line-height: 130%;
  }
}
tu-label-chip {
  line-height: 130%;
}
@media (max-width: 500px) {
  tu-label-chip {
    letter-spacing: 0;
  }
}
tu-label-chip {
  letter-spacing: 0;
}
tu-label-chip[size=medium] {
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-label-chip[size=medium] {
    font-size: 18px;
  }
}
tu-label-chip[size=medium] {
  font-size: 18px;
}
@media (max-width: 500px) {
  tu-label-chip[size=medium] {
    font-weight: 600;
  }
}
tu-label-chip[size=medium] {
  font-weight: 600;
}
@media (max-width: 500px) {
  tu-label-chip[size=medium] {
    font-style: normal;
  }
}
tu-label-chip[size=medium] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-label-chip[size=medium] {
    line-height: 130%;
  }
}
tu-label-chip[size=medium] {
  line-height: 130%;
}
@media (max-width: 500px) {
  tu-label-chip[size=medium] {
    letter-spacing: 0;
  }
}
tu-label-chip[size=medium] {
  letter-spacing: 0;
}
tu-label-chip[size=small] {
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-label-chip[size=small] {
    font-size: 16px;
  }
}
tu-label-chip[size=small] {
  font-size: 16px;
}
@media (max-width: 500px) {
  tu-label-chip[size=small] {
    font-weight: 600;
  }
}
tu-label-chip[size=small] {
  font-weight: 600;
}
@media (max-width: 500px) {
  tu-label-chip[size=small] {
    font-style: normal;
  }
}
tu-label-chip[size=small] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-label-chip[size=small] {
    line-height: 130%;
  }
}
tu-label-chip[size=small] {
  line-height: 130%;
}
@media (max-width: 500px) {
  tu-label-chip[size=small] {
    letter-spacing: 0;
  }
}
tu-label-chip[size=small] {
  letter-spacing: 0;
}
tu-label-chip[size="extra small"] {
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-label-chip[size="extra small"] {
    font-size: 14px;
  }
}
tu-label-chip[size="extra small"] {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-label-chip[size="extra small"] {
    font-weight: 500;
  }
}
tu-label-chip[size="extra small"] {
  font-weight: 500;
}
@media (max-width: 500px) {
  tu-label-chip[size="extra small"] {
    font-style: normal;
  }
}
tu-label-chip[size="extra small"] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-label-chip[size="extra small"] {
    line-height: 140%;
  }
}
tu-label-chip[size="extra small"] {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-label-chip[size="extra small"] {
    letter-spacing: 0.05px;
  }
}
tu-label-chip[size="extra small"] {
  letter-spacing: 0.05px;
}

:root {
  --tu-status-chip-padding-v: 2px;
  --tu-status-chip-padding-h: 4px;
  --tu-status-chip-content-text-padding-h: 2px;
  --tu-status-chip-content-padding-h: 12px;
  --tu-status-chip-radius: 32px;
  --tu-status-chip-gap: 2px;
}

@media (max-width: 500px) {
  :root {
    --tu-status-chip-padding-v: 2px;
    --tu-status-chip-padding-h: 4px;
    --tu-status-chip-content-text-padding-h: 2px;
    --tu-status-chip-content-padding-h: 12px;
    --tu-status-chip-radius: 32px;
    --tu-status-chip-gap: 2px;
  }
}
tu-status-chip {
  --tu-status-chip-light-color: var(--color-primary-100);
  --tu-status-chip-dark-color: var(--color-primary-700);
  --tu-status-chip-main-color: var(--color-primary-600);
}
tu-status-chip[status=grey] {
  --tu-status-chip-light-color: var(--color-secondary-100);
  --tu-status-chip-dark-color: var(--color-secondary-700);
  --tu-status-chip-main-color: var(--color-secondary-600);
}
tu-status-chip[status=info] {
  --tu-status-chip-light-color: var(--color-status-info-100);
  --tu-status-chip-dark-color: var(--color-status-info-700);
  --tu-status-chip-main-color: var(--color-status-info-600);
}
tu-status-chip[status=success] {
  --tu-status-chip-light-color: var(--color-status-success-100);
  --tu-status-chip-dark-color: var(--color-status-success-700);
  --tu-status-chip-main-color: var(--color-status-success-600);
}
tu-status-chip[status=warning] {
  --tu-status-chip-light-color: var(--color-status-warning-100);
  --tu-status-chip-dark-color: var(--color-status-warning-700);
  --tu-status-chip-main-color: var(--color-status-warning-600);
}
tu-status-chip[status=error] {
  --tu-status-chip-light-color: var(--color-status-error-100);
  --tu-status-chip-dark-color: var(--color-status-error-700);
  --tu-status-chip-main-color: var(--color-status-error-600);
}
tu-status-chip[status=premium] {
  --tu-status-chip-light-color: var(--color-premium-gradient-light);
  --tu-status-chip-dark-color: var(--color-premium-gradient-dark);
  --tu-status-chip-main-color: var(--color-premium-gradient);
}
tu-status-chip {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  background: var(--tu-status-chip-light-color);
  border-radius: var(--tu-status-chip-radius);
  color: var(--tu-status-chip-dark-color);
  padding: var(--tu-status-chip-padding-v) var(--tu-status-chip-padding-h);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-status-chip {
    font-size: 12px;
  }
}
tu-status-chip {
  font-size: 12px;
}
@media (max-width: 500px) {
  tu-status-chip {
    font-weight: 500;
  }
}
tu-status-chip {
  font-weight: 500;
}
@media (max-width: 500px) {
  tu-status-chip {
    font-style: medium;
  }
}
tu-status-chip {
  font-style: medium;
}
@media (max-width: 500px) {
  tu-status-chip {
    line-height: 120%;
  }
}
tu-status-chip {
  line-height: 120%;
}
@media (max-width: 500px) {
  tu-status-chip {
    letter-spacing: 0.3px;
  }
}
tu-status-chip {
  letter-spacing: 0.3px;
}
tu-status-chip tu-status-chip-content-text {
  padding: 0 var(--tu-status-chip-content-text-padding-h);
}
tu-status-chip tu-status-chip-content {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: var(--tu-status-chip-gap);
}
tu-status-chip[padding=loose] tu-status-chip-content {
  padding: 0 var(--tu-status-chip-content-padding-h);
}
tu-status-chip tu-button button[type=icon-basic] tu-icon::before,
tu-status-chip tu-icon::before {
  background: var(--tu-status-chip-dark-color) !important;
}
tu-status-chip[theme=white] {
  background: var(--color-secondary-0);
  border: 1px solid var(--tu-status-chip-main-color);
}
tu-status-chip[theme=primary] {
  background: var(--tu-status-chip-main-color);
  color: var(--color-secondary-0);
}
tu-status-chip[theme=primary] tu-button button[type=icon-basic] tu-icon::before,
tu-status-chip[theme=primary] tu-icon::before {
  background: var(--color-secondary-0) !important;
}

:root {
  --tu-slots-gap-v-xlarge: 16px;
  --tu-slots-gap-v-large: 12px;
  --tu-slots-gap-v-medium: 8px;
  --tu-slots-gap-v-small: 4px;
  --tu-slots-gap-h-xlarge: 16px;
  --tu-slots-gap-h-large: 12px;
  --tu-slots-gap-h-medium: 8px;
  --tu-slots-gap-h-small: 4px;
}

@media (max-width: 500px) {
  :root {
    --tu-slots-gap-v-xlarge: 16px;
    --tu-slots-gap-v-large: 12px;
    --tu-slots-gap-v-medium: 8px;
    --tu-slots-gap-v-small: 4px;
    --tu-slots-gap-h-xlarge: 16px;
    --tu-slots-gap-h-large: 12px;
    --tu-slots-gap-h-medium: 8px;
    --tu-slots-gap-h-small: 4px;
  }
}
tu-slots {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-slots-gap-v-large);
}
tu-slots[padding=medium] {
  gap: var(--tu-slots-gap-v-medium);
}
tu-slots[padding=small] {
  gap: var(--tu-slots-gap-v-small);
}
tu-slots[indented]:not([align=horizontal]) {
  margin-left: var(--tu-global-indent);
  width: calc(100% - var(--tu-global-indent));
}
tu-slots[align=horizontal] {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: var(--tu-slots-gap-h-xlarge) !important;
}
tu-slots[align=horizontal] > * {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  min-width: 0;
}
tu-slots[align=horizontal][padding=large] {
  gap: var(--tu-slots-gap-h-large);
}
tu-slots[align=horizontal][padding=medium] {
  gap: var(--tu-slots-gap-h-medium);
}
tu-slots[align=horizontal][padding=small] {
  gap: var(--tu-slots-gap-h-small);
}

:root {
  --tu-table-corner: 8px;
  --tu-table-cell-padding: 12px;
  --tu-table-row-indent: 64px;
  --tu-table-row-height: 56px;
}

@media (max-width: 500px) {
  :root {
    --tu-table-corner: 8px;
    --tu-table-cell-padding: 12px;
    --tu-table-row-indent: 64px;
    --tu-table-row-height: 56px;
  }
}
tu-table {
  border-radius: var(--tu-table-corner);
  overflow: hidden;
  overflow-x: auto;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
  border-top: 1px solid var(--color-secondary-100);
  border-bottom: 1px solid var(--color-secondary-100);
}
tu-table table {
  border-collapse: collapse;
  width: 100%;
}
tu-table table .tu-table-row-inner {
  overflow: hidden;
  width: 100%;
}
tu-table table td,
tu-table table th {
  padding: var(--tu-table-cell-padding);
}
tu-table table tr {
  height: var(--tu-table-row-height);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-table table tr {
    font-size: 14px;
  }
}
tu-table table tr {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-table table tr {
    font-weight: regular;
  }
}
tu-table table tr {
  font-weight: regular;
}
@media (max-width: 500px) {
  tu-table table tr {
    font-style: normal;
  }
}
tu-table table tr {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-table table tr {
    line-height: 140%;
  }
}
tu-table table tr {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-table table tr {
    letter-spacing: 0.15px;
  }
}
tu-table table tr {
  letter-spacing: 0.15px;
}
tu-table table tr.tu-table-row-indented td:first-child, tu-table table tr.tu-table-row-indented th:first-child {
  padding-left: var(--tu-table-row-indent);
}
tu-table table tr.tu-collapse-toggle {
  cursor: pointer;
}
tu-table table tr:not(:last-child),
tu-table table thead {
  border-bottom: 1px solid var(--color-secondary-100);
}
tu-table table tfoot {
  border-top: 1px solid var(--color-secondary-100);
}
tu-table table thead,
tu-table table tfoot,
tu-table table .tu-header-styling {
  background: var(--color-secondary-50);
}

:root {
  --tu-tooltip-corner: 16px;
  --tu-tooltip-padding-h: 16px;
  --tu-tooltip-padding-v: 12px;
  --tu-tooltip-gap-v: 16px;
  --tu-tooltip-width-large: 320px;
  --tu-tooltip-width-medium: 285px;
  --tu-tooltip-width-small: 250px;
}

@media (max-width: 500px) {
  :root {
    --tu-tooltip-corner: 16px;
    --tu-tooltip-padding-h: 16px;
    --tu-tooltip-padding-v: 12px;
    --tu-tooltip-gap-v: 16px;
    --tu-tooltip-width-large: 320px;
    --tu-tooltip-width-medium: 285px;
    --tu-tooltip-width-small: 250px;
  }
}
tu-tooltip {
  border: none;
  padding: var(--tu-tooltip-padding-v) var(--tu-tooltip-padding-h);
  border-radius: var(--tu-tooltip-corner);
  background-color: var(--color-secondary-900);
  color: var(--color-secondary-0);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-tooltip {
    font-size: 14px;
  }
}
tu-tooltip {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-tooltip {
    font-weight: regular;
  }
}
tu-tooltip {
  font-weight: regular;
}
@media (max-width: 500px) {
  tu-tooltip {
    font-style: normal;
  }
}
tu-tooltip {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-tooltip {
    line-height: 140%;
  }
}
tu-tooltip {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-tooltip {
    letter-spacing: 0.15px;
  }
}
tu-tooltip {
  letter-spacing: 0.15px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-box-shadow: 0 64px 18px 0 rgba(61, 61, 61, 0), 0 41px 16px 0 rgba(61, 61, 61, 0.01), 0 23px 14px 0 rgba(61, 61, 61, 0.03), 0 10px 10px 0 rgba(61, 61, 61, 0.05), 0 3px 6px 0 rgba(61, 61, 61, 0.06);
          box-shadow: 0 64px 18px 0 rgba(61, 61, 61, 0), 0 41px 16px 0 rgba(61, 61, 61, 0.01), 0 23px 14px 0 rgba(61, 61, 61, 0.03), 0 10px 10px 0 rgba(61, 61, 61, 0.05), 0 3px 6px 0 rgba(61, 61, 61, 0.06);
}
tu-tooltip[popover] {
  overflow: visible;
}
tu-tooltip::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #222;
  border-bottom: none;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: -8px;
}
tu-tooltip[position=left]::after {
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 8px solid #222;
  border-right: none;
  left: unset;
  right: -8px;
  top: 50%;
  bottom: unset;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
tu-tooltip[position=right]::after {
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: none;
  border-right: 8px solid #222;
  left: -8px;
  right: unset;
  top: 50%;
  bottom: unset;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
tu-tooltip[position=bottom]::after {
  border-top: none;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 8px solid #222;
  top: -8px;
  bottom: unset;
  left: 50%;
  right: unset;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
tu-tooltip[width=large] {
  width: var(--tu-tooltip-width-large);
}
tu-tooltip[width=medium] {
  width: var(--tu-tooltip-width-medium);
}
tu-tooltip[width=small] {
  width: var(--tu-tooltip-width-small);
}

tu-tooltip-trigger {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

:root {
  --tu-boolean-radio-dimension: 20px;
  --tu-boolean-radio-margin: 2px;
  --tu-boolean-checkbox-dimension: 18px;
  --tu-boolean-checkbox-icon-dimension: 24px;
  --tu-boolean-checkbox-margin: 3px;
  --tu-boolean-margin-top: 2px;
  --tu-boolean-gap-v: 2px;
  --tu-boolean-gap-h: 6px;
  --tu-boolean-label-gap: 6px;
  --tu-boolean-corner: 4px;
  --tu-boolean-border: 2px;
  --tu-boolean-outline-offset: 2px;
  --tu-boolean-outline: 6px;
  --tu-boolean-toggle-width: 32px;
  --tu-boolean-toggle-height: 18px;
  --tu-boolean-toggle-knob-dimension: 12px;
  --tu-boolean-toggle-padding: 3px;
  --tu-boolean-toggle-corner: 12px;
}

@media (max-width: 500px) {
  :root {
    --tu-boolean-radio-dimension: 20px;
    --tu-boolean-radio-margin: 2px;
    --tu-boolean-checkbox-dimension: 18px;
    --tu-boolean-checkbox-icon-dimension: 24px;
    --tu-boolean-checkbox-margin: 3px;
    --tu-boolean-margin-top: 2px;
    --tu-boolean-gap-v: 2px;
    --tu-boolean-gap-h: 6px;
    --tu-boolean-label-gap: 6px;
    --tu-boolean-corner: 4px;
    --tu-boolean-border: 2px;
    --tu-boolean-outline-offset: 2px;
    --tu-boolean-outline: 6px;
    --tu-boolean-toggle-width: 32px;
    --tu-boolean-toggle-height: 18px;
    --tu-boolean-toggle-knob-dimension: 12px;
    --tu-boolean-toggle-padding: 3px;
    --tu-boolean-toggle-corner: 12px;
  }
}
tu-boolean {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: var(--tu-boolean-gap-h);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-boolean {
    font-size: 14px;
  }
}
tu-boolean {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-boolean {
    font-weight: regular;
  }
}
tu-boolean {
  font-weight: regular;
}
@media (max-width: 500px) {
  tu-boolean {
    font-style: normal;
  }
}
tu-boolean {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-boolean {
    line-height: 140%;
  }
}
tu-boolean {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-boolean {
    letter-spacing: 0.15px;
  }
}
tu-boolean {
  letter-spacing: 0.15px;
}
tu-boolean .tu-boolean-content-wrapper {
  margin-top: var(--tu-boolean-margin-top);
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
tu-boolean .tu-boolean-label-wrapper {
  margin-bottom: var(--tu-boolean-gap-v);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: var(--tu-boolean-label-gap);
}
tu-boolean[disabled] .tu-boolean-label {
  color: var(--color-secondary-400);
  cursor: not-allowed;
}
tu-boolean[disabled] .tu-boolean-description {
  color: var(--color-secondary-400);
}
tu-boolean .tu-boolean-label {
  cursor: pointer;
}
tu-boolean .tu-boolean-description {
  color: var(--color-secondary-600);
}
tu-boolean input[type=checkbox] {
  margin: var(--tu-boolean-checkbox-margin);
  width: var(--tu-boolean-checkbox-dimension);
  height: var(--tu-boolean-checkbox-dimension);
  cursor: pointer;
  padding: 0;
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: var(--tu-boolean-border) solid var(--color-secondary-300);
  border-radius: var(--tu-boolean-corner);
  background: var(--color-secondary-0);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
tu-boolean input[type=checkbox]:disabled {
  cursor: not-allowed;
  border-color: var(--color-secondary-100) !important;
}
tu-boolean input[type=checkbox]:disabled:checked {
  background: var(--color-primary-100);
  border-color: var(--color-primary-100) !important;
}
tu-boolean input[type=checkbox]:indeterminate {
  border-color: var(--color-primary-600);
  background-color: var(--color-primary-600);
}
tu-boolean input[type=checkbox]:indeterminate::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
tu-boolean input[type=checkbox]:indeterminate::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: var(--tu-boolean-checkbox-icon-dimension);
  height: var(--tu-boolean-checkbox-icon-dimension);
  background-image: url("./components/icon/svgs/minus.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
tu-boolean input[type=checkbox]:checked {
  border-color: var(--color-primary-600);
  background-color: var(--color-primary-600);
}
tu-boolean input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: var(--tu-boolean-checkbox-icon-dimension);
  height: var(--tu-boolean-checkbox-icon-dimension);
  background-image: url("./components/icon/svgs/check.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
tu-boolean input[type=checkbox]:checked::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
tu-boolean input[type=checkbox]:focus-visible {
  outline: none !important;
  -webkit-box-shadow: 0 0 0 var(--tu-boolean-outline-offset) var(--color-secondary-0), 0 0 0 var(--tu-boolean-outline) var(--color-primary-300);
          box-shadow: 0 0 0 var(--tu-boolean-outline-offset) var(--color-secondary-0), 0 0 0 var(--tu-boolean-outline) var(--color-primary-300);
}
tu-boolean input[type=radio] {
  margin: var(--tu-boolean-radio-margin);
  width: var(--tu-boolean-radio-dimension);
  height: var(--tu-boolean-radio-dimension);
  cursor: pointer;
  padding: 0;
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: var(--tu-boolean-border) solid var(--color-secondary-300);
  border-radius: 50%;
  background: var(--color-secondary-0);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
tu-boolean input[type=radio]:disabled {
  cursor: not-allowed;
  border-color: var(--color-secondary-100) !important;
}
tu-boolean input[type=radio]:disabled:checked {
  background: var(--color-primary-100);
  border-color: var(--color-primary-100) !important;
}
tu-boolean input[type=radio]:checked {
  border-color: var(--color-primary-600);
  background-color: var(--color-primary-600);
}
tu-boolean input[type=radio]:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: calc(var(--tu-boolean-radio-dimension) / 2);
  height: calc(var(--tu-boolean-radio-dimension) / 2);
  background: var(--color-secondary-0);
  border-radius: 100%;
}
tu-boolean input[type=radio]:focus-visible {
  outline: none !important;
  -webkit-box-shadow: 0 0 0 var(--tu-boolean-outline-offset) var(--color-secondary-0), 0 0 0 var(--tu-boolean-outline) var(--color-primary-300);
          box-shadow: 0 0 0 var(--tu-boolean-outline-offset) var(--color-secondary-0), 0 0 0 var(--tu-boolean-outline) var(--color-primary-300);
}

tu-boolean-toggle {
  display: inline-block;
  cursor: pointer;
}
tu-boolean-toggle[disabled] {
  cursor: not-allowed;
}
tu-boolean-toggle[disabled] .toggle-wrapper {
  background: var(--color-secondary-100);
}
tu-boolean-toggle[disabled] input[type=checkbox]:checked + .toggle-wrapper {
  background: var(--color-primary-100);
}
tu-boolean-toggle .toggle-wrapper {
  width: var(--tu-boolean-toggle-width);
  height: var(--tu-boolean-toggle-height);
  background: var(--color-secondary-200);
  border-radius: var(--tu-boolean-toggle-corner);
  position: relative;
  -webkit-transition: background 0.2s ease;
  transition: background 0.2s ease;
}
tu-boolean-toggle .handle {
  width: var(--tu-boolean-toggle-knob-dimension);
  height: var(--tu-boolean-toggle-knob-dimension);
  background: var(--color-secondary-0);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: var(--tu-boolean-toggle-padding);
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  -webkit-transition: -webkit-transform 0.2s ease;
  transition: -webkit-transform 0.2s ease;
  transition: transform 0.2s ease;
  transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
tu-boolean-toggle input[type=checkbox]:checked + .toggle-wrapper {
  background: var(--color-primary-600);
}
tu-boolean-toggle input[type=checkbox]:checked + .toggle-wrapper .handle {
  -webkit-transform: translate(calc(var(--tu-boolean-toggle-width) - var(--tu-boolean-toggle-knob-dimension) - 2 * var(--tu-boolean-toggle-padding)), -50%);
          transform: translate(calc(var(--tu-boolean-toggle-width) - var(--tu-boolean-toggle-knob-dimension) - 2 * var(--tu-boolean-toggle-padding)), -50%);
}
tu-boolean-toggle input[type=checkbox]:focus-visible + .toggle-wrapper {
  -webkit-box-shadow: 0 0 0 var(--tu-boolean-outline-offset) var(--color-secondary-0), 0 0 0 var(--tu-boolean-outline) var(--color-primary-300);
          box-shadow: 0 0 0 var(--tu-boolean-outline-offset) var(--color-secondary-0), 0 0 0 var(--tu-boolean-outline) var(--color-primary-300);
}
tu-boolean-toggle input[type=checkbox] {
  position: absolute;
  opacity: 0;
}

tu-boolean-group {
  display: contents;
}

:root {
  --tu-text-input-gap-h: 4px;
  --tu-text-input-padding-v: 6px;
}

@media (max-width: 500px) {
  :root {
    --tu-text-input-gap-h: 4px;
    --tu-text-input-padding-v: 6px;
  }
}
tu-text-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--tu-text-input-gap-h);
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  padding: var(--tu-text-input-padding-v) 0px;
}
tu-text-input > [data-tu-text-input-role=prefix] {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  max-width: 40%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-secondary-900);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-text-input > [data-tu-text-input-role=prefix] {
    font-size: 14px;
  }
}
tu-text-input > [data-tu-text-input-role=prefix] {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-text-input > [data-tu-text-input-role=prefix] {
    font-weight: 400;
  }
}
tu-text-input > [data-tu-text-input-role=prefix] {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-text-input > [data-tu-text-input-role=prefix] {
    font-style: normal;
  }
}
tu-text-input > [data-tu-text-input-role=prefix] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-text-input > [data-tu-text-input-role=prefix] {
    line-height: 140%;
  }
}
tu-text-input > [data-tu-text-input-role=prefix] {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-text-input > [data-tu-text-input-role=prefix] {
    letter-spacing: 0.15px;
  }
}
tu-text-input > [data-tu-text-input-role=prefix] {
  letter-spacing: 0.15px;
}
tu-text-input > input[data-tu-text-input-role=value] {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  background: none;
  border: none;
  height: 20px;
  padding: 0px;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-text-input > input[data-tu-text-input-role=value] {
    font-size: 14px;
  }
}
tu-text-input > input[data-tu-text-input-role=value] {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-text-input > input[data-tu-text-input-role=value] {
    font-weight: 400;
  }
}
tu-text-input > input[data-tu-text-input-role=value] {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-text-input > input[data-tu-text-input-role=value] {
    font-style: normal;
  }
}
tu-text-input > input[data-tu-text-input-role=value] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-text-input > input[data-tu-text-input-role=value] {
    line-height: 140%;
  }
}
tu-text-input > input[data-tu-text-input-role=value] {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-text-input > input[data-tu-text-input-role=value] {
    letter-spacing: 0.15px;
  }
}
tu-text-input > input[data-tu-text-input-role=value] {
  letter-spacing: 0.15px;
}
tu-text-input > input[data-tu-text-input-role=value]:focus, tu-text-input > input[data-tu-text-input-role=value]:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

tu-input[disabled] tu-text-input > [data-tu-text-input-role=prefix],
tu-input[state=disabled] tu-text-input > [data-tu-text-input-role=prefix] {
  color: var(--color-secondary-400);
}
tu-input[disabled] tu-text-input > input[data-tu-text-input-role=value],
tu-input[state=disabled] tu-text-input > input[data-tu-text-input-role=value] {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
  cursor: not-allowed;
}
tu-input[disabled] tu-text-input > input[data-tu-text-input-role=value]::-webkit-input-placeholder,
tu-input[state=disabled] tu-text-input > input[data-tu-text-input-role=value]::-webkit-input-placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-input > input[data-tu-text-input-role=value]::-moz-placeholder,
tu-input[state=disabled] tu-text-input > input[data-tu-text-input-role=value]::-moz-placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-input > input[data-tu-text-input-role=value]::-ms-input-placeholder,
tu-input[state=disabled] tu-text-input > input[data-tu-text-input-role=value]::-ms-input-placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-input > input[data-tu-text-input-role=value]::placeholder,
tu-input[state=disabled] tu-text-input > input[data-tu-text-input-role=value]::placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}

:root {
  --tu-text-area-input-padding-v: 6px;
}

@media (max-width: 500px) {
  :root {
    --tu-text-area-input-padding-v: 6px;
  }
}
tu-text-area-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: var(--tu-text-input-padding-v) 0px;
}
tu-text-area-input textarea {
  background: none;
  border: none;
  height: 100px;
  resize: none;
  width: 100%;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-text-area-input textarea {
    font-size: 14px;
  }
}
tu-text-area-input textarea {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-text-area-input textarea {
    font-weight: 400;
  }
}
tu-text-area-input textarea {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-text-area-input textarea {
    font-style: normal;
  }
}
tu-text-area-input textarea {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-text-area-input textarea {
    line-height: 140%;
  }
}
tu-text-area-input textarea {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-text-area-input textarea {
    letter-spacing: 0.15px;
  }
}
tu-text-area-input textarea {
  letter-spacing: 0.15px;
}
tu-text-area-input textarea:focus, tu-text-area-input textarea:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

tu-input[disabled] tu-text-area-input > textarea[data-tu-text-input-role=value],
tu-input[state=disabled] tu-text-area-input > textarea[data-tu-text-input-role=value] {
  cursor: not-allowed;
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::-webkit-input-placeholder,
tu-input[state=disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::-webkit-input-placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::-moz-placeholder,
tu-input[state=disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::-moz-placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::-ms-input-placeholder,
tu-input[state=disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::-ms-input-placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}
tu-input[disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::placeholder,
tu-input[state=disabled] tu-text-area-input > textarea[data-tu-text-input-role=value]::placeholder {
  color: var(--color-secondary-400);
  -webkit-text-fill-color: var(--color-secondary-400);
  opacity: 1;
}

:root {
  --tu-select-input-padding-v: 6px;
  --tu-select-input-gap-icons: 8px;
  --tu-select-input-dropdown-gap: 6px;
  --tu-select-input-dropdown-padding-v: 10px;
  --tu-select-input-dropdown-padding-h: 16px;
  --tu-select-input-dropdown-corner: 12px;
  --tu-select-input-gap-dropdown-option-h: 6px;
  --tu-select-input-pill-gap: 8px;
  --tu-select-input-pill-padding-v: 6px;
  --tu-select-input-pill-padding-h: 12px;
  --tu-select-input-pill-corner: 8px;
}

@media (max-width: 500px) {
  :root {
    --tu-select-input-padding-v: 6px;
    --tu-select-input-gap-icons: 8px;
    --tu-select-input-dropdown-gap: 6px;
    --tu-select-input-dropdown-padding-v: 10px;
    --tu-select-input-dropdown-padding-h: 16px;
    --tu-select-input-dropdown-corner: 12px;
    --tu-select-input-gap-dropdown-option-h: 6px;
    --tu-select-input-pill-gap: 8px;
    --tu-select-input-pill-padding-v: 6px;
    --tu-select-input-pill-padding-h: 12px;
    --tu-select-input-pill-corner: 8px;
  }
}
tu-input:has(tu-select-input):not([disabled]):not([state=disabled]) {
  cursor: pointer;
}
tu-input:has(tu-select-input):not([disabled]):not([state=disabled]) tu-select-input,
tu-input:has(tu-select-input):not([disabled]):not([state=disabled]) tu-select-input > button[data-tu-select-input-role=trigger] {
  cursor: pointer;
}

tu-select-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  padding: var(--tu-select-input-padding-v);
}
tu-select-input tu-select-input-options {
  position: absolute;
  top: calc(100% + var(--tu-select-input-dropdown-gap));
  left: 0;
  display: none;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: var(--color-secondary-0);
  border: 1px solid var(--color-secondary-200);
  border-radius: var(--tu-select-input-dropdown-corner);
  -webkit-box-shadow: 0 21px 6px 0 rgba(84, 84, 84, 0), 0 13px 5px 0 rgba(84, 84, 84, 0.01), 0 7px 4px 0 rgba(84, 84, 84, 0.03), 0 3px 3px 0 rgba(84, 84, 84, 0.04), 0 1px 2px 0 rgba(84, 84, 84, 0.05);
          box-shadow: 0 21px 6px 0 rgba(84, 84, 84, 0), 0 13px 5px 0 rgba(84, 84, 84, 0.01), 0 7px 4px 0 rgba(84, 84, 84, 0.03), 0 3px 3px 0 rgba(84, 84, 84, 0.04), 0 1px 2px 0 rgba(84, 84, 84, 0.05);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 2;
  overflow: hidden;
}
tu-select-input tu-select-input-options > tu-select-input-option {
  background: none;
  border: none;
  padding: var(--tu-select-input-dropdown-padding-v) var(--tu-select-input-dropdown-padding-h);
  text-align: left;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--tu-select-input-gap-dropdown-option-h);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-select-input tu-select-input-options > tu-select-input-option {
    font-size: 14px;
  }
}
tu-select-input tu-select-input-options > tu-select-input-option {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-select-input tu-select-input-options > tu-select-input-option {
    font-weight: 400;
  }
}
tu-select-input tu-select-input-options > tu-select-input-option {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-select-input tu-select-input-options > tu-select-input-option {
    font-style: normal;
  }
}
tu-select-input tu-select-input-options > tu-select-input-option {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-select-input tu-select-input-options > tu-select-input-option {
    line-height: 140%;
  }
}
tu-select-input tu-select-input-options > tu-select-input-option {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-select-input tu-select-input-options > tu-select-input-option {
    letter-spacing: 0.15px;
  }
}
tu-select-input tu-select-input-options > tu-select-input-option {
  letter-spacing: 0.15px;
}
tu-select-input tu-select-input-options > tu-select-input-option tu-icon {
  display: none;
}
tu-select-input tu-select-input-options > tu-select-input-option[data-selected] tu-icon {
  display: block;
}
tu-select-input tu-select-input-options > tu-select-input-option tu-icon::before {
  background: var(--color-secondary-900) !important;
}
tu-select-input tu-select-input-options > tu-select-input-option:focus, tu-select-input tu-select-input-options > tu-select-input-option:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
tu-select-input tu-select-input-options > tu-select-input-option:hover {
  background: var(--color-secondary-50);
}
tu-select-input tu-select-input-options > tu-select-input-option:not(:last-child) {
  border-bottom: 1px solid var(--color-secondary-100);
}
tu-select-input tu-select-input-options > tu-select-input-option[data-highlighted], tu-select-input tu-select-input-options > tu-select-input-option[data-selected] {
  background: var(--color-secondary-50);
}
tu-select-input[open] tu-select-input-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
tu-select-input > button[data-tu-select-input-role=trigger] {
  padding: 0px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  background: none;
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: var(--tu-select-input-gap-icons);
  text-align: left;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-select-input > button[data-tu-select-input-role=trigger] {
    font-size: 14px;
  }
}
tu-select-input > button[data-tu-select-input-role=trigger] {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-select-input > button[data-tu-select-input-role=trigger] {
    font-weight: 400;
  }
}
tu-select-input > button[data-tu-select-input-role=trigger] {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-select-input > button[data-tu-select-input-role=trigger] {
    font-style: normal;
  }
}
tu-select-input > button[data-tu-select-input-role=trigger] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-select-input > button[data-tu-select-input-role=trigger] {
    line-height: 140%;
  }
}
tu-select-input > button[data-tu-select-input-role=trigger] {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-select-input > button[data-tu-select-input-role=trigger] {
    letter-spacing: 0.15px;
  }
}
tu-select-input > button[data-tu-select-input-role=trigger] {
  letter-spacing: 0.15px;
}
tu-select-input > button[data-tu-select-input-role=trigger]:focus, tu-select-input > button[data-tu-select-input-role=trigger]:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
tu-select-input > button[data-tu-select-input-role=trigger] > [data-tu-select-input-role=trigger-label] {
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
tu-select-input > button[data-tu-select-input-role=trigger] > [data-tu-select-input-role=trigger-label][data-placeholder] {
  color: var(--color-secondary-400);
}
tu-select-input > button[data-tu-select-input-role=trigger] > tu-icon[data-tu-select-input-role=icon] {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  pointer-events: none;
}
tu-select-input > button[data-tu-select-input-role=trigger] > tu-icon[data-tu-select-input-role=icon]::before {
  background: var(--color-secondary-500);
}
tu-select-input[open] > button[data-tu-select-input-role=trigger] > tu-icon[data-tu-select-input-role=icon] {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
tu-select-input[multi-select] {
  gap: var(--tu-select-input-gap-icons);
}
tu-select-input[multi-select] > button[data-tu-select-input-role=trigger] {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: auto;
}
tu-select-input[multi-select] > tu-select-input-pills {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--tu-select-input-pill-gap);
  min-width: 0;
}
tu-select-input[multi-select] > tu-select-input-pills:focus, tu-select-input[multi-select] > tu-select-input-pills:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
  color: var(--color-secondary-400);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
    font-size: 14px;
  }
}
tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
    font-weight: 400;
  }
}
tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
    font-style: normal;
  }
}
tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
    line-height: 140%;
  }
}
tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
    letter-spacing: 0.15px;
  }
}
tu-select-input[multi-select] [data-tu-select-input-role=pills-placeholder] {
  letter-spacing: 0.15px;
}
tu-select-input[multi-select] tu-select-input-pill {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--tu-select-input-gap-dropdown-option-h);
  max-width: 100%;
  padding: var(--tu-select-input-pill-padding-v) var(--tu-select-input-pill-padding-h);
  border: 1px solid var(--color-secondary-200);
  border-radius: var(--tu-select-input-pill-corner);
  background: var(--color-secondary-0);
  color: var(--color-secondary-900);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] tu-select-input-pill {
    font-size: 14px;
  }
}
tu-select-input[multi-select] tu-select-input-pill {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] tu-select-input-pill {
    font-weight: 400;
  }
}
tu-select-input[multi-select] tu-select-input-pill {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] tu-select-input-pill {
    font-style: normal;
  }
}
tu-select-input[multi-select] tu-select-input-pill {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] tu-select-input-pill {
    line-height: 140%;
  }
}
tu-select-input[multi-select] tu-select-input-pill {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-select-input[multi-select] tu-select-input-pill {
    letter-spacing: 0.15px;
  }
}
tu-select-input[multi-select] tu-select-input-pill {
  letter-spacing: 0.15px;
}
tu-select-input[multi-select] [data-tu-select-input-role=pill-label] {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove] {
  position: relative;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 16px;
  height: 16px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove]::before, tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove]::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  content: "";
  border-radius: 999px;
  background: var(--color-secondary-500);
}
tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove]::before {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
          transform: translate(-50%, -50%) rotate(45deg);
}
tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove]::after {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
          transform: translate(-50%, -50%) rotate(-45deg);
}
tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove]:focus, tu-select-input[multi-select] button[data-tu-select-input-role=pill-remove]:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

tu-input[disabled] tu-select-input > button[data-tu-select-input-role=trigger],
tu-input[state=disabled] tu-select-input > button[data-tu-select-input-role=trigger] {
  color: var(--color-secondary-400);
  cursor: not-allowed;
}
tu-input[disabled] tu-select-input > button[data-tu-select-input-role=trigger] > [data-tu-select-input-role=trigger-label],
tu-input[state=disabled] tu-select-input > button[data-tu-select-input-role=trigger] > [data-tu-select-input-role=trigger-label] {
  color: var(--color-secondary-400);
}
tu-input[disabled] tu-select-input > button[data-tu-select-input-role=trigger] > tu-icon[data-tu-select-input-role=icon]::before,
tu-input[state=disabled] tu-select-input > button[data-tu-select-input-role=trigger] > tu-icon[data-tu-select-input-role=icon]::before {
  background: var(--color-secondary-400);
}
tu-input[disabled] tu-select-input tu-select-input-pill,
tu-input[state=disabled] tu-select-input tu-select-input-pill {
  color: var(--color-secondary-400);
}
tu-input[disabled] tu-select-input button[data-tu-select-input-role=pill-remove],
tu-input[state=disabled] tu-select-input button[data-tu-select-input-role=pill-remove] {
  cursor: not-allowed;
}
tu-input[disabled] tu-select-input button[data-tu-select-input-role=pill-remove]::before, tu-input[disabled] tu-select-input button[data-tu-select-input-role=pill-remove]::after,
tu-input[state=disabled] tu-select-input button[data-tu-select-input-role=pill-remove]::before,
tu-input[state=disabled] tu-select-input button[data-tu-select-input-role=pill-remove]::after {
  background: var(--color-secondary-400);
}

tu-input:has(tu-select-input) {
  position: relative;
}

tu-date-picker-text-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  color: var(--color-secondary-900);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-date-picker-text-input {
    font-size: 14px;
  }
}
tu-date-picker-text-input {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-date-picker-text-input {
    font-weight: 400;
  }
}
tu-date-picker-text-input {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-date-picker-text-input {
    font-style: normal;
  }
}
tu-date-picker-text-input {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-date-picker-text-input {
    line-height: 140%;
  }
}
tu-date-picker-text-input {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-date-picker-text-input {
    letter-spacing: 0.15px;
  }
}
tu-date-picker-text-input {
  letter-spacing: 0.15px;
  text-align: left;
  letter-spacing: 0;
}
tu-date-picker-text-input:focus, tu-date-picker-text-input:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
tu-date-picker-text-input [data-tu-date-picker-text-input-segment],
tu-date-picker-text-input [data-tu-date-picker-text-input-separator] {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 0;
  color: inherit;
}
tu-date-picker-text-input [data-tu-date-picker-text-input-segment] {
  border-bottom: 1px solid transparent;
}
tu-date-picker-text-input [data-tu-date-picker-text-input-segment][data-active] {
  color: var(--color-primary-600);
  border-bottom-color: var(--color-primary-600);
}
tu-date-picker-text-input > tu-button {
  margin-left: auto;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}

tu-input[disabled] tu-date-picker-text-input,
tu-input[state=disabled] tu-date-picker-text-input {
  color: var(--color-secondary-400);
}

:root {
  --tu-date-picker-input-padding-v: 6px;
  --tu-date-picker-input-dropdown-gap: 8px;
  --tu-date-picker-input-dropdown-sections-gap-v: 20px;
  --tu-date-picker-input-dropdown-corner: 12px;
  --tu-date-picker-input-dropdown-padding: 16px;
  --tu-date-picker-input-day-padding-v: 10px;
  --tu-date-picker-input-day-padding-h: 4px;
  --tu-date-picker-input-dropdown-row-corner: 8px;
  --tu-date-picker-input-actions-gap: 16px;
}

@media (max-width: 500px) {
  :root {
    --tu-date-picker-input-padding-v: 6px;
    --tu-date-picker-input-dropdown-gap: 8px;
    --tu-date-picker-input-dropdown-sections-gap-v: 20px;
    --tu-date-picker-input-dropdown-corner: 12px;
    --tu-date-picker-input-dropdown-padding: 16px;
    --tu-date-picker-input-day-padding-v: 10px;
    --tu-date-picker-input-day-padding-h: 4px;
    --tu-date-picker-input-dropdown-row-corner: 8px;
    --tu-date-picker-input-actions-gap: 16px;
  }
}
tu-input:has(tu-date-picker-input):not([disabled]):not([state=disabled]) {
  cursor: pointer;
}
tu-input:has(tu-date-picker-input):not([disabled]):not([state=disabled]) tu-date-picker-input,
tu-input:has(tu-date-picker-input):not([disabled]):not([state=disabled]) tu-date-picker-input tu-date-picker-text-input {
  cursor: pointer;
}

tu-date-picker-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  padding: var(--tu-date-picker-input-padding-v);
}
tu-date-picker-input > [data-tu-date-picker-input-role=popover] {
  position: absolute;
  top: calc(100% + var(--tu-date-picker-input-dropdown-gap));
  left: 0;
  display: none;
  width: 100%;
  background: var(--color-secondary-0);
  border: 1px solid var(--color-secondary-200);
  border-radius: var(--tu-date-picker-input-dropdown-corner);
  -webkit-box-shadow: 0 21px 6px 0 rgba(84, 84, 84, 0), 0 13px 5px 0 rgba(84, 84, 84, 0.01), 0 7px 4px 0 rgba(84, 84, 84, 0.03), 0 3px 3px 0 rgba(84, 84, 84, 0.04), 0 1px 2px 0 rgba(84, 84, 84, 0.05);
          box-shadow: 0 21px 6px 0 rgba(84, 84, 84, 0), 0 13px 5px 0 rgba(84, 84, 84, 0.01), 0 7px 4px 0 rgba(84, 84, 84, 0.03), 0 3px 3px 0 rgba(84, 84, 84, 0.04), 0 1px 2px 0 rgba(84, 84, 84, 0.05);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 3;
}
tu-date-picker-input[open] > [data-tu-date-picker-input-role=popover] {
  display: block;
}

.tu-date-picker-input-calendar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-date-picker-input-dropdown-sections-gap-v);
  padding: var(--tu-date-picker-input-dropdown-padding);
}

.tu-date-picker-input-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.tu-date-picker-input-month-label {
  text-align: center;
  color: var(--color-secondary-900);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-date-picker-input-month-label {
    font-size: 16px;
  }
}
.tu-date-picker-input-month-label {
  font-size: 16px;
}
@media (max-width: 500px) {
  .tu-date-picker-input-month-label {
    font-weight: 500;
  }
}
.tu-date-picker-input-month-label {
  font-weight: 500;
}
@media (max-width: 500px) {
  .tu-date-picker-input-month-label {
    font-style: normal;
  }
}
.tu-date-picker-input-month-label {
  font-style: normal;
}
@media (max-width: 500px) {
  .tu-date-picker-input-month-label {
    line-height: 140%;
  }
}
.tu-date-picker-input-month-label {
  line-height: 140%;
}
@media (max-width: 500px) {
  .tu-date-picker-input-month-label {
    letter-spacing: 0.15px;
  }
}
.tu-date-picker-input-month-label {
  letter-spacing: 0.15px;
}

.tu-date-picker-input-nav,
.tu-date-picker-input-day {
  border: none;
  background: none;
  color: var(--color-secondary-800);
  cursor: pointer;
}
.tu-date-picker-input-nav:focus, .tu-date-picker-input-nav:active,
.tu-date-picker-input-day:focus,
.tu-date-picker-input-day:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.tu-date-picker-input-weekdays,
.tu-date-picker-input-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.tu-date-picker-input-weekdays {
  overflow: hidden;
  border-radius: var(--tu-date-picker-input-dropdown-row-corner);
  background: var(--color-secondary-50);
}
.tu-date-picker-input-weekdays > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-width: 0;
  padding: var(--tu-date-picker-input-day-padding-v) var(--tu-date-picker-input-day-padding-h);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: var(--color-secondary-700);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-date-picker-input-weekdays > div {
    font-size: 14px;
  }
}
.tu-date-picker-input-weekdays > div {
  font-size: 14px;
}
@media (max-width: 500px) {
  .tu-date-picker-input-weekdays > div {
    font-weight: 400;
  }
}
.tu-date-picker-input-weekdays > div {
  font-weight: 400;
}
@media (max-width: 500px) {
  .tu-date-picker-input-weekdays > div {
    font-style: normal;
  }
}
.tu-date-picker-input-weekdays > div {
  font-style: normal;
}
@media (max-width: 500px) {
  .tu-date-picker-input-weekdays > div {
    line-height: 140%;
  }
}
.tu-date-picker-input-weekdays > div {
  line-height: 140%;
}
@media (max-width: 500px) {
  .tu-date-picker-input-weekdays > div {
    letter-spacing: 0.15px;
  }
}
.tu-date-picker-input-weekdays > div {
  letter-spacing: 0.15px;
}

.tu-date-picker-input-day {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  min-width: 0;
  padding: var(--tu-date-picker-input-day-padding-v) var(--tu-date-picker-input-day-padding-h);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  justify-self: stretch;
  border-radius: 8px;
  color: var(--color-secondary-800);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-date-picker-input-day {
    font-size: 14px;
  }
}
.tu-date-picker-input-day {
  font-size: 14px;
}
@media (max-width: 500px) {
  .tu-date-picker-input-day {
    font-weight: 400;
  }
}
.tu-date-picker-input-day {
  font-weight: 400;
}
@media (max-width: 500px) {
  .tu-date-picker-input-day {
    font-style: normal;
  }
}
.tu-date-picker-input-day {
  font-style: normal;
}
@media (max-width: 500px) {
  .tu-date-picker-input-day {
    line-height: 140%;
  }
}
.tu-date-picker-input-day {
  line-height: 140%;
}
@media (max-width: 500px) {
  .tu-date-picker-input-day {
    letter-spacing: 0.15px;
  }
}
.tu-date-picker-input-day {
  letter-spacing: 0.15px;
}
.tu-date-picker-input-day:hover, .tu-date-picker-input-day.is-active {
  background: var(--color-secondary-50);
}
.tu-date-picker-input-day.is-outside-month {
  color: var(--color-secondary-400);
}
.tu-date-picker-input-day.is-today {
  color: var(--color-primary-600);
}
.tu-date-picker-input-day.is-today::after {
  position: absolute;
  bottom: 8px;
  left: 50%;
  width: 4px;
  height: 4px;
  content: "";
  border-radius: 100%;
  background: var(--color-primary-600);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.tu-date-picker-input-day.is-selected {
  background: var(--color-primary-600);
  color: var(--color-secondary-0);
}
.tu-date-picker-input-day.is-selected::after {
  background: var(--color-secondary-0);
}

.tu-date-picker-input-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tu-date-picker-input-actions-gap);
}
.tu-date-picker-input-actions button {
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

tu-input[disabled] tu-date-picker-input tu-date-picker-text-input,
tu-input[state=disabled] tu-date-picker-input tu-date-picker-text-input {
  color: var(--color-secondary-400);
  cursor: not-allowed;
}

tu-input:has(tu-date-picker-input) {
  position: relative;
}

tu-time-picker-text-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  color: var(--color-secondary-900);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  tu-time-picker-text-input {
    font-size: 14px;
  }
}
tu-time-picker-text-input {
  font-size: 14px;
}
@media (max-width: 500px) {
  tu-time-picker-text-input {
    font-weight: 400;
  }
}
tu-time-picker-text-input {
  font-weight: 400;
}
@media (max-width: 500px) {
  tu-time-picker-text-input {
    font-style: normal;
  }
}
tu-time-picker-text-input {
  font-style: normal;
}
@media (max-width: 500px) {
  tu-time-picker-text-input {
    line-height: 140%;
  }
}
tu-time-picker-text-input {
  line-height: 140%;
}
@media (max-width: 500px) {
  tu-time-picker-text-input {
    letter-spacing: 0.15px;
  }
}
tu-time-picker-text-input {
  letter-spacing: 0.15px;
  text-align: left;
  letter-spacing: 0;
}
tu-time-picker-text-input:focus, tu-time-picker-text-input:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
tu-time-picker-text-input [data-tu-time-picker-text-input-segment],
tu-time-picker-text-input [data-tu-time-picker-text-input-separator] {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 0;
  color: inherit;
}
tu-time-picker-text-input [data-tu-time-picker-text-input-segment] {
  border-bottom: 1px solid transparent;
}
tu-time-picker-text-input [data-tu-time-picker-text-input-segment][data-active] {
  color: var(--color-primary-600);
  border-bottom-color: var(--color-primary-600);
}
tu-time-picker-text-input > tu-button {
  margin-left: auto;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}

tu-input[disabled] tu-time-picker-text-input,
tu-input[state=disabled] tu-time-picker-text-input {
  color: var(--color-secondary-400);
}

:root {
  --tu-time-picker-input-padding-v: 6px;
  --tu-time-picker-input-dropdown-gap: 8px;
  --tu-time-picker-input-dropdown-corner: 12px;
  --tu-time-picker-input-dropdown-padding: 24px;
  --tu-time-picker-input-picker-gap: 24px;
  --tu-time-picker-input-option-padding-v: 8px;
  --tu-time-picker-input-option-padding-h: 12px;
  --tu-time-picker-input-actions-gap: 16px;
  --tu-time-picker-input-selection-corner: 8px;
}

@media (max-width: 500px) {
  :root {
    --tu-time-picker-input-padding-v: 6px;
    --tu-time-picker-input-dropdown-gap: 8px;
    --tu-time-picker-input-dropdown-corner: 12px;
    --tu-time-picker-input-dropdown-padding: 24px;
    --tu-time-picker-input-picker-gap: 24px;
    --tu-time-picker-input-option-padding-v: 8px;
    --tu-time-picker-input-option-padding-h: 12px;
    --tu-time-picker-input-actions-gap: 16px;
    --tu-time-picker-input-selection-corner: 8px;
  }
}
tu-input:has(tu-time-picker-input):not([disabled]):not([state=disabled]) {
  cursor: pointer;
}
tu-input:has(tu-time-picker-input):not([disabled]):not([state=disabled]) tu-time-picker-input,
tu-input:has(tu-time-picker-input):not([disabled]):not([state=disabled]) tu-time-picker-input tu-time-picker-text-input {
  cursor: pointer;
}

tu-time-picker-input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  padding: var(--tu-time-picker-input-padding-v);
}
tu-time-picker-input > [data-tu-time-picker-input-role=popover] {
  position: absolute;
  top: calc(100% + var(--tu-time-picker-input-dropdown-gap));
  left: 0;
  display: none;
  width: 100%;
  background: var(--color-secondary-0);
  border: 1px solid var(--color-secondary-200);
  border-radius: var(--tu-time-picker-input-dropdown-corner);
  -webkit-box-shadow: 0 21px 6px 0 rgba(84, 84, 84, 0), 0 13px 5px 0 rgba(84, 84, 84, 0.01), 0 7px 4px 0 rgba(84, 84, 84, 0.03), 0 3px 3px 0 rgba(84, 84, 84, 0.04), 0 1px 2px 0 rgba(84, 84, 84, 0.05);
          box-shadow: 0 21px 6px 0 rgba(84, 84, 84, 0), 0 13px 5px 0 rgba(84, 84, 84, 0.01), 0 7px 4px 0 rgba(84, 84, 84, 0.03), 0 3px 3px 0 rgba(84, 84, 84, 0.04), 0 1px 2px 0 rgba(84, 84, 84, 0.05);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 3;
}
tu-time-picker-input[open] > [data-tu-time-picker-input-role=popover] {
  display: block;
}

.tu-time-picker-input-picker {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--tu-time-picker-input-picker-gap);
  padding: var(--tu-time-picker-input-dropdown-padding);
}

.tu-time-picker-input-wheels {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) minmax(0, 1fr);
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: var(--tu-time-picker-input-actions-gap);
}
.tu-time-picker-input-wheels::before {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: calc(var(--tu-time-picker-input-option-padding-v) * 2 + 20px);
  content: "";
  border: 2px solid var(--color-primary-300);
  border-radius: var(--tu-time-picker-input-selection-corner);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  pointer-events: none;
}

.tu-time-picker-input-wheel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  min-width: 0;
}
.tu-time-picker-input-wheel > tu-button {
  -ms-flex-item-align: center;
      align-self: center;
}

.tu-time-picker-input-wheel-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  min-width: 0;
}

.tu-time-picker-input-period-options {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}

.tu-time-picker-input-option {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: calc(var(--tu-time-picker-input-option-padding-v) * 2 + 20px);
  padding: var(--tu-time-picker-input-option-padding-v) var(--tu-time-picker-input-option-padding-h);
  border: none;
  background: none;
  color: var(--color-secondary-600);
  cursor: pointer;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-time-picker-input-option {
    font-size: 14px;
  }
}
.tu-time-picker-input-option {
  font-size: 14px;
}
@media (max-width: 500px) {
  .tu-time-picker-input-option {
    font-weight: 400;
  }
}
.tu-time-picker-input-option {
  font-weight: 400;
}
@media (max-width: 500px) {
  .tu-time-picker-input-option {
    font-style: normal;
  }
}
.tu-time-picker-input-option {
  font-style: normal;
}
@media (max-width: 500px) {
  .tu-time-picker-input-option {
    line-height: 140%;
  }
}
.tu-time-picker-input-option {
  line-height: 140%;
}
@media (max-width: 500px) {
  .tu-time-picker-input-option {
    letter-spacing: 0.15px;
  }
}
.tu-time-picker-input-option {
  letter-spacing: 0.15px;
}
.tu-time-picker-input-option.is-distance-1 {
  color: var(--color-secondary-700);
}
.tu-time-picker-input-option.is-distance-2 {
  color: var(--color-secondary-500);
}
.tu-time-picker-input-option:focus, .tu-time-picker-input-option:active {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.tu-time-picker-input-option.is-selected {
  color: var(--color-primary-700);
}
.tu-time-picker-input-option.is-placeholder {
  visibility: hidden;
  pointer-events: none;
}

.tu-time-picker-input-separator-column {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: var(--color-primary-700);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-time-picker-input-separator-column {
    font-size: 14px;
  }
}
.tu-time-picker-input-separator-column {
  font-size: 14px;
}
@media (max-width: 500px) {
  .tu-time-picker-input-separator-column {
    font-weight: 400;
  }
}
.tu-time-picker-input-separator-column {
  font-weight: 400;
}
@media (max-width: 500px) {
  .tu-time-picker-input-separator-column {
    font-style: normal;
  }
}
.tu-time-picker-input-separator-column {
  font-style: normal;
}
@media (max-width: 500px) {
  .tu-time-picker-input-separator-column {
    line-height: 140%;
  }
}
.tu-time-picker-input-separator-column {
  line-height: 140%;
}
@media (max-width: 500px) {
  .tu-time-picker-input-separator-column {
    letter-spacing: 0.15px;
  }
}
.tu-time-picker-input-separator-column {
  letter-spacing: 0.15px;
}

.tu-time-picker-input-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tu-time-picker-input-actions-gap);
}
.tu-time-picker-input-actions button {
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

tu-input[disabled] tu-time-picker-input tu-time-picker-text-input,
tu-input[state=disabled] tu-time-picker-input tu-time-picker-text-input {
  color: var(--color-secondary-400);
  cursor: not-allowed;
}

tu-input:has(tu-time-picker-input) {
  position: relative;
}

:root {
  --tu-input-padding-h: 16px;
  --tu-input-padding-v: 8px;
  --tu-input-padding-v-medium: 4px;
  --tu-input-padding-v-action: 4px;
  --tu-input-gap-main: 12px;
  --tu-input-gap-icons: 8px;
  --tu-input-corner: 12px;
  --tu-input-gap-label: 6px;
  --tu-input-gap-input-wrapper-elements: 6px;
  --tu-input-outline: 2px;
}

@media (max-width: 500px) {
  :root {
    --tu-input-padding-h: 16px;
    --tu-input-padding-v: 8px;
    --tu-input-padding-v-medium: 4px;
    --tu-input-padding-v-action: 4px;
    --tu-input-gap-main: 12px;
    --tu-input-gap-icons: 8px;
    --tu-input-corner: 12px;
    --tu-input-gap-label: 6px;
    --tu-input-gap-input-wrapper-elements: 6px;
    --tu-input-outline: 2px;
  }
}
tu-input {
  background: var(--color-secondary-50);
  padding: var(--tu-input-padding-v) var(--tu-input-padding-h);
  border-radius: var(--tu-input-corner);
}
tu-input[vertical-size=medium] {
  padding: var(--tu-input-padding-v-medium) var(--tu-input-padding-h);
}
tu-input[vertical-size=small] {
  padding: 0px var(--tu-input-padding-h);
}
tu-input tu-divider {
  height: 12px;
  color: var(--color-secondary-300);
  border-radius: 100px;
}
tu-input[state=focus] {
  outline: var(--tu-input-outline) solid var(--color-status-info-500);
}
tu-input[state=error] {
  outline: var(--tu-input-outline) solid var(--color-status-error-600);
  background: var(--color-status-error-50);
}
tu-input[state=valid] {
  outline: var(--tu-input-outline) solid var(--color-status-success-600);
  background: var(--color-status-success-50);
}
tu-input[state=disabled] {
  outline: 1px solid var(--color-secondary-100);
  background: var(--color-secondary-0);
  cursor: not-allowed;
}
tu-input[state=disabled] tu-input-right-wrapper {
  display: none;
}

tu-input,
tu-input-left-wrapper,
tu-input-right-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: var(--tu-input-gap-icons);
}

tu-input-text-part-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
}
tu-input-text-part-wrapper > * {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
}

tu-input-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: var(--tu-input-gap-input-wrapper-elements);
}
tu-input-wrapper:has(> tu-input[disabled]) .tu-input-wrapper-label-wrapper,
tu-input-wrapper:has(> tu-input[disabled]) .tu-input-wrapper-helper-text, tu-input-wrapper:has(> tu-input[state=disabled]) .tu-input-wrapper-label-wrapper,
tu-input-wrapper:has(> tu-input[state=disabled]) .tu-input-wrapper-helper-text {
  color: var(--color-secondary-400);
}

.tu-input-wrapper-label-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--tu-input-gap-label);
  color: var(--color-secondary-600);
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-input-wrapper-label-wrapper {
    font-size: 14px;
  }
}
.tu-input-wrapper-label-wrapper {
  font-size: 14px;
}
@media (max-width: 500px) {
  .tu-input-wrapper-label-wrapper {
    font-weight: 500;
  }
}
.tu-input-wrapper-label-wrapper {
  font-weight: 500;
}
@media (max-width: 500px) {
  .tu-input-wrapper-label-wrapper {
    font-style: medium;
  }
}
.tu-input-wrapper-label-wrapper {
  font-style: medium;
}
@media (max-width: 500px) {
  .tu-input-wrapper-label-wrapper {
    line-height: 140%;
  }
}
.tu-input-wrapper-label-wrapper {
  line-height: 140%;
}
@media (max-width: 500px) {
  .tu-input-wrapper-label-wrapper {
    letter-spacing: 0.3px;
  }
}
.tu-input-wrapper-label-wrapper {
  letter-spacing: 0.3px;
}

.tu-input-wrapper-helper-text {
  color: var(--color-secondary-600);
  text-decoration: underline;
  font-family: Inter;
  text-align: justify;
}
@media (max-width: 500px) {
  .tu-input-wrapper-helper-text {
    font-size: 12px;
  }
}
.tu-input-wrapper-helper-text {
  font-size: 12px;
}
@media (max-width: 500px) {
  .tu-input-wrapper-helper-text {
    font-weight: 500;
  }
}
.tu-input-wrapper-helper-text {
  font-weight: 500;
}
@media (max-width: 500px) {
  .tu-input-wrapper-helper-text {
    font-style: medium;
  }
}
.tu-input-wrapper-helper-text {
  font-style: medium;
}
@media (max-width: 500px) {
  .tu-input-wrapper-helper-text {
    line-height: 120%;
  }
}
.tu-input-wrapper-helper-text {
  line-height: 120%;
}
@media (max-width: 500px) {
  .tu-input-wrapper-helper-text {
    letter-spacing: 0.3px;
  }
}
.tu-input-wrapper-helper-text {
  letter-spacing: 0.3px;
  text-align: right;
}

tu-visibility-toggle-content {
  display: contents;
}
tu-visibility-toggle-content[hidden] {
  display: none;
}

tu-visibility-toggle-trigger {
  display: contents;
}

tu-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  gap: var(--tu-global-gap-h);
  max-height: 100%;
}
tu-row[no-column-scroll] {
  max-height: unset;
}
@media screen and (max-width: 1366px) {
  tu-row:not([no-wrap]) {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media screen and (max-width: 1366px) {
  tu-row:not([no-wrap]) tu-column {
    -webkit-box-flex: 1 !important;
        -ms-flex: 1 !important;
            flex: 1 !important;
  }
}

tu-column {
  overflow: scroll;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("./fonts/Inter/Inter-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("./fonts/Inter/Inter-Italic.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("./fonts/Inter/Inter-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("./fonts/Inter/Inter-BoldItalic.woff2") format("woff2");
}
@supports (font-variation-settings: normal) {
  @font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("./fonts/Inter/InterVariable.woff2") format("woff2");
  }
  @font-face {
    font-family: "Inter";
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url("./fonts/Inter/InterVariable-Italic.woff2") format("woff2");
  }
}