@import url("https://fonts.googleapis.com/css2?family=Google+Sans+Flex:opsz,wght@6..144,1..1000&display=swap");
@layer reset {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
  }
  html {
    color-scheme: light dark;
    -webkit-text-size-adjust: 100%;
  }
  input,
  textarea,
  select,
  button {
    font: inherit;
  }
}
:root {
  --agFontFamily: 'Google Sans Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
  --agFontSizeXxl: 26px;
  --agFontSizeXl: 20px;
  --agFontSizeLg: 16px;
  --agFontSizeMd: 14px;
  --agFontSizeSm: 12px;
  --agFontSizeXs: 10px;
  --agFontSizeXxs: 8px;
  --agControlSizeXxs: 20px;
  --agControlSizeXs: 28px;
  --agControlSizeSm: 36px;
  --agControlSizeMd: 44px;
  --agControlSizeLg: 52px;
  --agControlSizeXl: 60px;
  --agControlSizeXxl: 68px;
}

html.admin {
  --agControlSizeXxs: 16px;
  --agControlSizeXs: 24px;
  --agControlSizeSm: 32px;
  --agControlSizeMd: 40px;
  --agControlSizeLg: 48px;
  --agControlSizeXl: 56px;
  --agControlSizeXxl: 64px;
}

html[color-scheme=light] {
  color-scheme: light;
}

html:not([color-scheme]).pos,
html[color-scheme=dark] {
  color-scheme: dark;
}*,
*::before,
*::after {
  box-sizing: inherit; }

html {
  box-sizing: border-box;
  line-height: 1.3;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.no-padding {
  padding: 0; }

.code {
  display: block;
  color: white;
  tab-size: 1.5rem;
  background: #282c34;
  border-radius: var(--ui-spacing);
  overflow: auto;
  padding: calc(4 * var(--ui-spacing)); }

main {
  display: block; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

pre {
  font-family: monospace, monospace;
  font-size: 1rem;
  margin: 0; }

a {
  background-color: transparent; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

b,
strong {
  font-weight: bolder; }

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1rem; }

small {
  font-size: 80%; }

img {
  border-style: none; }

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button,
select {
  text-transform: none; }

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  padding: 0.35rem 0.75rem 0.625rem; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

progress {
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type='checkbox'],
[type='radio'] {
  box-sizing: border-box;
  padding: 0; }

[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
  height: auto; }

[type='search'] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type='search']::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

details {
  display: block; }

summary {
  display: list-item; }

template {
  display: none; }

[hidden] {
  display: none; }

html {
  --ui-color-white: white;
  --ui-color-black: #000;
  --ui-color-primary: #2d88ff;
  --ui-color-primary-text: var(--ui-color-white);
  --ui-color-secondary: rgb(245, 0, 93);
  --ui-color-secondary-text: var(--ui-color-white);
  --ui-color-success: #1ac567;
  --ui-color-success-text: var(--ui-color-white);
  --ui-color-error: #ef5350;
  --ui-color-error-text: var(--ui-color-white);
  --ui-color-warning: #ffb500;
  --ui-color-warning-text: var(--ui-color-white);
  --ui-color-info: #42a5f5;
  --ui-color-info-text: var(--ui-color-white);
  --ui-color-yellow: #ffeb3b;
  --ui-color-yellow-text: var(--ui-color-black);
  --ui-spacing: 6px;
  --ui-border-radius: 6px;
  --ui-size--1: 30px;
  --ui-size-0: 36px;
  --ui-size-1: 40px;
  --ui-size-2: 48px;
  --ui-size-3: 52px;
  --UiButton-border-radius: var(--border-radius);
  --UiButton-font-size--1: 0.875rem;
  --UiButton-font-size-0: 16px;
  --UiButton-font-size-1: 1.125rem;
  --UiButton-font-size-2: 1.125rem;
  --UiButton-font-size-3: 1.15rem;
  --UiText-font-size--4: calc(1rem * 0.5);
  --UiText-font-size--3: calc(1rem * 0.625);
  --UiText-font-size--2: calc(1rem * 0.75);
  --UiText-font-size--1: calc(1rem * 0.8125);
  --UiText-font-size-0: calc(1rem * 1);
  --UiText-font-size-1: calc(1rem * 1.125);
  --UiText-font-size-2: calc(1rem * 1.25);
  --UiText-font-size-3: calc(1rem * 1.5);
  --UiText-font-size-4: calc(1rem * 1.75);
  --UiText-font-size-5: calc(1rem * 2);
  --UiText-font-size-6: calc(1rem * 2.25);
  --UiText-font-size-7: calc(1rem * 2.5);
  --UiText-font-size-8: calc(1rem * 2.75);
  --UiText-font-size-9: calc(1rem * 3);
  --UiContainer-max-width: 1400px;
  --UiDialog-z-index: 2000;
  --UiDialog-max-width: 512px;
  --UiInput-font-size: 16px;
  --UiBadge-border-radius: calc(2 * var(--ui-border-radius));
  --UiCard-box-shadow: var(--ui-box-shadow);
  --UiCard-border-radius: var(--ui-border-radius);
  --UiCard-background-color: var(--ui-color-surface);
  --UiTable-header-text-color: var(--ui-color-text-secondary);
  --UiTable-row-divider-color: var(--ui-color-divider); }

html[dark] {
  --ui-color-body: #18191a;
  --ui-color-surface: #242526;
  --ui-color-text-primary: #e4e6eb;
  --ui-color-text-secondary: #b0b3b8;
  --ui-color-disabled: rgba(255, 255, 255, 0.3);
  --ui-color-divider: #3e4042;
  --ui-color-overlay: rgba(0, 0, 0, 0.4);
  --ui-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  --UiButton-filled-default-background-color: rgba(255, 255, 255, 0.1);
  --UiButton-hover: rgba(255, 255, 255, 0.1);
  --UiInput-background-color: rgb(58, 59, 60);
  background-color: var(--ui-color-body);
  color: var(--ui-color-text-primary); }

html:not([dark]) {
  --ui-color-body: #f0f2f5;
  --ui-color-surface: #fff;
  --ui-color-text-primary: #050505;
  --ui-color-text-secondary: #65676b;
  --ui-color-disabled: #bec3c9;
  --ui-color-divider: #dadde1;
  --ui-color-overlay: rgba(0, 0, 0, 0.4);
  --ui-box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px 0px;
  --UiButton-filled-default-background-color: rgba(0, 0, 0, 0.05);
  --UiButton-hover: rgba(0, 0, 0, 0.05);
  --UiInput-background-color: rgb(240, 242, 245);
  background-color: var(--ui-color-body);
  color: var(--ui-color-text-primary); }

.UiAlert {
  background-color: var(--ui-background-color-surface);
  border: 1px solid var(--ui-color-divider);
  border-radius: var(--ui-border-radius); }
  .UiAlert.color-body {
    border-color: var(--ui-color-body);
    color: var(--ui-color-body); }
  .UiAlert.color-body-inverse {
    border-color: var(--ui-color-body-inverse);
    color: var(--ui-color-body-inverse); }
  .UiAlert.color-surface {
    border-color: var(--ui-color-surface);
    color: var(--ui-color-surface); }
  .UiAlert.color-primary {
    border-color: var(--ui-color-primary);
    color: var(--ui-color-primary); }
  .UiAlert.color-secondary {
    border-color: var(--ui-color-secondary);
    color: var(--ui-color-secondary); }
  .UiAlert.color-success {
    border-color: var(--ui-color-success);
    color: var(--ui-color-success); }
  .UiAlert.color-error {
    border-color: var(--ui-color-error);
    color: var(--ui-color-error); }
  .UiAlert.color-info {
    border-color: var(--ui-color-info);
    color: var(--ui-color-info); }
  .UiAlert.color-warning {
    border-color: var(--ui-color-warning);
    color: var(--ui-color-warning); }
  .UiAlert.color-yellow {
    border-color: var(--ui-color-yellow);
    color: var(--ui-color-yellow); }
  .UiAlert.color-text-primary {
    border-color: var(--ui-color-text-primary);
    color: var(--ui-color-text-primary); }
  .UiAlert.color-text-primary-inverse {
    border-color: var(--ui-color-text-primary-inverse);
    color: var(--ui-color-text-primary-inverse); }
  .UiAlert.color-text-secondary {
    border-color: var(--ui-color-text-secondary);
    color: var(--ui-color-text-secondary); }
  .UiAlert.color-divider {
    border-color: var(--ui-color-divider);
    color: var(--ui-color-divider); }
  .UiAlert.color-black {
    border-color: var(--ui-color-black);
    color: var(--ui-color-black); }
  .UiAlert.color-white {
    border-color: var(--ui-color-white);
    color: var(--ui-color-white); }

.UiBadge-container {
  display: inline-flex;
  position: relative; }

.UiBadge {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  z-index: 1;
  border-radius: var(--UiBadge-border-radius); }

.UiBox.backgroundColor-body {
  background-color: var(--ui-color-body); }

.UiBox.color-body {
  color: var(--ui-color-body); }

.UiBox.backgroundColor-body-inverse {
  background-color: var(--ui-color-body-inverse); }

.UiBox.color-body-inverse {
  color: var(--ui-color-body-inverse); }

.UiBox.backgroundColor-surface {
  background-color: var(--ui-color-surface); }

.UiBox.color-surface {
  color: var(--ui-color-surface); }

.UiBox.backgroundColor-primary {
  background-color: var(--ui-color-primary); }

.UiBox.color-primary {
  color: var(--ui-color-primary); }

.UiBox.backgroundColor-secondary {
  background-color: var(--ui-color-secondary); }

.UiBox.color-secondary {
  color: var(--ui-color-secondary); }

.UiBox.backgroundColor-success {
  background-color: var(--ui-color-success); }

.UiBox.color-success {
  color: var(--ui-color-success); }

.UiBox.backgroundColor-error {
  background-color: var(--ui-color-error); }

.UiBox.color-error {
  color: var(--ui-color-error); }

.UiBox.backgroundColor-info {
  background-color: var(--ui-color-info); }

.UiBox.color-info {
  color: var(--ui-color-info); }

.UiBox.backgroundColor-warning {
  background-color: var(--ui-color-warning); }

.UiBox.color-warning {
  color: var(--ui-color-warning); }

.UiBox.backgroundColor-yellow {
  background-color: var(--ui-color-yellow); }

.UiBox.color-yellow {
  color: var(--ui-color-yellow); }

.UiBox.backgroundColor-text-primary {
  background-color: var(--ui-color-text-primary); }

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

.UiBox.backgroundColor-text-primary-inverse {
  background-color: var(--ui-color-text-primary-inverse); }

.UiBox.color-text-primary-inverse {
  color: var(--ui-color-text-primary-inverse); }

.UiBox.backgroundColor-text-secondary {
  background-color: var(--ui-color-text-secondary); }

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

.UiBox.backgroundColor-divider {
  background-color: var(--ui-color-divider); }

.UiBox.color-divider {
  color: var(--ui-color-divider); }

.UiBox.backgroundColor-black {
  background-color: var(--ui-color-black); }

.UiBox.color-black {
  color: var(--ui-color-black); }

.UiBox.backgroundColor-white {
  background-color: var(--ui-color-white); }

.UiBox.color-white {
  color: var(--ui-color-white); }

.UiBox.padding-1 {
  padding: calc(var(--ui-spacing) * 1); }

.UiBox.paddingTop-1 {
  padding-top: calc(var(--ui-spacing) * 1); }

.UiBox.paddingRight-1 {
  padding-right: calc(var(--ui-spacing) * 1); }

.UiBox.paddingBottom-1 {
  padding-bottom: calc(var(--ui-spacing) * 1); }

.UiBox.paddingLeft-1 {
  padding-left: calc(var(--ui-spacing) * 1); }

.UiBox.paddingHorizontal-1 {
  padding-left: calc(var(--ui-spacing) * 1);
  padding-right: calc(var(--ui-spacing) * 1); }

.UiBox.paddingVertical-1 {
  padding-top: calc(var(--ui-spacing) * 1);
  padding-bottom: calc(var(--ui-spacing) * 1); }

.UiBox.padding-2 {
  padding: calc(var(--ui-spacing) * 2); }

.UiBox.paddingTop-2 {
  padding-top: calc(var(--ui-spacing) * 2); }

.UiBox.paddingRight-2 {
  padding-right: calc(var(--ui-spacing) * 2); }

.UiBox.paddingBottom-2 {
  padding-bottom: calc(var(--ui-spacing) * 2); }

.UiBox.paddingLeft-2 {
  padding-left: calc(var(--ui-spacing) * 2); }

.UiBox.paddingHorizontal-2 {
  padding-left: calc(var(--ui-spacing) * 2);
  padding-right: calc(var(--ui-spacing) * 2); }

.UiBox.paddingVertical-2 {
  padding-top: calc(var(--ui-spacing) * 2);
  padding-bottom: calc(var(--ui-spacing) * 2); }

.UiBox.padding-3 {
  padding: calc(var(--ui-spacing) * 3); }

.UiBox.paddingTop-3 {
  padding-top: calc(var(--ui-spacing) * 3); }

.UiBox.paddingRight-3 {
  padding-right: calc(var(--ui-spacing) * 3); }

.UiBox.paddingBottom-3 {
  padding-bottom: calc(var(--ui-spacing) * 3); }

.UiBox.paddingLeft-3 {
  padding-left: calc(var(--ui-spacing) * 3); }

.UiBox.paddingHorizontal-3 {
  padding-left: calc(var(--ui-spacing) * 3);
  padding-right: calc(var(--ui-spacing) * 3); }

.UiBox.paddingVertical-3 {
  padding-top: calc(var(--ui-spacing) * 3);
  padding-bottom: calc(var(--ui-spacing) * 3); }

.UiBox.padding-4 {
  padding: calc(var(--ui-spacing) * 4); }

.UiBox.paddingTop-4 {
  padding-top: calc(var(--ui-spacing) * 4); }

.UiBox.paddingRight-4 {
  padding-right: calc(var(--ui-spacing) * 4); }

.UiBox.paddingBottom-4 {
  padding-bottom: calc(var(--ui-spacing) * 4); }

.UiBox.paddingLeft-4 {
  padding-left: calc(var(--ui-spacing) * 4); }

.UiBox.paddingHorizontal-4 {
  padding-left: calc(var(--ui-spacing) * 4);
  padding-right: calc(var(--ui-spacing) * 4); }

.UiBox.paddingVertical-4 {
  padding-top: calc(var(--ui-spacing) * 4);
  padding-bottom: calc(var(--ui-spacing) * 4); }

.UiBox.padding-5 {
  padding: calc(var(--ui-spacing) * 5); }

.UiBox.paddingTop-5 {
  padding-top: calc(var(--ui-spacing) * 5); }

.UiBox.paddingRight-5 {
  padding-right: calc(var(--ui-spacing) * 5); }

.UiBox.paddingBottom-5 {
  padding-bottom: calc(var(--ui-spacing) * 5); }

.UiBox.paddingLeft-5 {
  padding-left: calc(var(--ui-spacing) * 5); }

.UiBox.paddingHorizontal-5 {
  padding-left: calc(var(--ui-spacing) * 5);
  padding-right: calc(var(--ui-spacing) * 5); }

.UiBox.paddingVertical-5 {
  padding-top: calc(var(--ui-spacing) * 5);
  padding-bottom: calc(var(--ui-spacing) * 5); }

.UiBox.padding-6 {
  padding: calc(var(--ui-spacing) * 6); }

.UiBox.paddingTop-6 {
  padding-top: calc(var(--ui-spacing) * 6); }

.UiBox.paddingRight-6 {
  padding-right: calc(var(--ui-spacing) * 6); }

.UiBox.paddingBottom-6 {
  padding-bottom: calc(var(--ui-spacing) * 6); }

.UiBox.paddingLeft-6 {
  padding-left: calc(var(--ui-spacing) * 6); }

.UiBox.paddingHorizontal-6 {
  padding-left: calc(var(--ui-spacing) * 6);
  padding-right: calc(var(--ui-spacing) * 6); }

.UiBox.paddingVertical-6 {
  padding-top: calc(var(--ui-spacing) * 6);
  padding-bottom: calc(var(--ui-spacing) * 6); }

.UiBox.padding-7 {
  padding: calc(var(--ui-spacing) * 7); }

.UiBox.paddingTop-7 {
  padding-top: calc(var(--ui-spacing) * 7); }

.UiBox.paddingRight-7 {
  padding-right: calc(var(--ui-spacing) * 7); }

.UiBox.paddingBottom-7 {
  padding-bottom: calc(var(--ui-spacing) * 7); }

.UiBox.paddingLeft-7 {
  padding-left: calc(var(--ui-spacing) * 7); }

.UiBox.paddingHorizontal-7 {
  padding-left: calc(var(--ui-spacing) * 7);
  padding-right: calc(var(--ui-spacing) * 7); }

.UiBox.paddingVertical-7 {
  padding-top: calc(var(--ui-spacing) * 7);
  padding-bottom: calc(var(--ui-spacing) * 7); }

.UiBox.padding-8 {
  padding: calc(var(--ui-spacing) * 8); }

.UiBox.paddingTop-8 {
  padding-top: calc(var(--ui-spacing) * 8); }

.UiBox.paddingRight-8 {
  padding-right: calc(var(--ui-spacing) * 8); }

.UiBox.paddingBottom-8 {
  padding-bottom: calc(var(--ui-spacing) * 8); }

.UiBox.paddingLeft-8 {
  padding-left: calc(var(--ui-spacing) * 8); }

.UiBox.paddingHorizontal-8 {
  padding-left: calc(var(--ui-spacing) * 8);
  padding-right: calc(var(--ui-spacing) * 8); }

.UiBox.paddingVertical-8 {
  padding-top: calc(var(--ui-spacing) * 8);
  padding-bottom: calc(var(--ui-spacing) * 8); }

.UiBox.border {
  border: 1px solid var(--ui-color-divider); }

.UiBox.borderRadiusTop {
  border-top-left-radius: var(--ui-border-radius);
  border-top-right-radius: var(--ui-border-radius); }

.UiBox.borderRadiusBottom {
  border-bottom-left-radius: var(--ui-border-radius);
  border-bottom-right-radius: var(--ui-border-radius); }

.UiBox.borderTop {
  border-top: 1px solid var(--ui-color-divider); }

.UiBox.borderRight {
  border-right: 1px solid var(--ui-color-divider); }

.UiBox.borderBottom {
  border-bottom: 1px solid var(--ui-color-divider); }

.UiBox.borderLeft {
  border-left: 1px solid var(--ui-color-divider); }

.UiBox.borderRadius {
  border-radius: var(--ui-border-radius); }

.UiBox.boxShadow {
  box-shadow: var(--ui-box-shadow); }

.UiBox.fullWidth {
  width: 100%; }

.UiBox.fullHeight {
  height: 100%; }

.UiBox.fullWidth {
  width: 100%; }

.UiBox.overflowAuto {
  overflow: auto; }

.UiBox.position-absolute {
  position: absolute; }

.UiBox.position-relative {
  position: relative; }

.UiBox.position-fixed {
  position: fixed; }

.UiBox.position-static {
  position: static; }

.UiButton {
  background-color: transparent;
  box-shadow: none;
  border: 1px solid transparent;
  border-radius: var(--ui-border-radius);
  position: relative;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 200ms, color 200ms, box-shadow 200ms, opacity 200ms;
  touch-action: manipulation;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-top: 0;
  padding-bottom: 0;
  font-weight: 500; }
  .UiButton.variant-outlined, .UiButton.variant-text {
    color: var(--ui-color-text-primary); }
    .UiButton.variant-outlined.color-body, .UiButton.variant-text.color-body {
      color: var(--ui-color-body); }
    .UiButton.variant-outlined.color-body-inverse, .UiButton.variant-text.color-body-inverse {
      color: var(--ui-color-body-inverse); }
    .UiButton.variant-outlined.color-surface, .UiButton.variant-text.color-surface {
      color: var(--ui-color-surface); }
    .UiButton.variant-outlined.color-primary, .UiButton.variant-text.color-primary {
      color: var(--ui-color-primary); }
    .UiButton.variant-outlined.color-secondary, .UiButton.variant-text.color-secondary {
      color: var(--ui-color-secondary); }
    .UiButton.variant-outlined.color-success, .UiButton.variant-text.color-success {
      color: var(--ui-color-success); }
    .UiButton.variant-outlined.color-error, .UiButton.variant-text.color-error {
      color: var(--ui-color-error); }
    .UiButton.variant-outlined.color-info, .UiButton.variant-text.color-info {
      color: var(--ui-color-info); }
    .UiButton.variant-outlined.color-warning, .UiButton.variant-text.color-warning {
      color: var(--ui-color-warning); }
    .UiButton.variant-outlined.color-yellow, .UiButton.variant-text.color-yellow {
      color: var(--ui-color-yellow); }
    .UiButton.variant-outlined.color-text-primary, .UiButton.variant-text.color-text-primary {
      color: var(--ui-color-text-primary); }
    .UiButton.variant-outlined.color-text-primary-inverse, .UiButton.variant-text.color-text-primary-inverse {
      color: var(--ui-color-text-primary-inverse); }
    .UiButton.variant-outlined.color-text-secondary, .UiButton.variant-text.color-text-secondary {
      color: var(--ui-color-text-secondary); }
    .UiButton.variant-outlined.color-divider, .UiButton.variant-text.color-divider {
      color: var(--ui-color-divider); }
    .UiButton.variant-outlined.color-black, .UiButton.variant-text.color-black {
      color: var(--ui-color-black); }
    .UiButton.variant-outlined.color-white, .UiButton.variant-text.color-white {
      color: var(--ui-color-white); }
  .UiButton.variant-outlined {
    border: 1px solid var(--ui-color-divider); }
    .UiButton.variant-outlined.color-body {
      border-color: var(--ui-color-body); }
    .UiButton.variant-outlined.color-body-inverse {
      border-color: var(--ui-color-body-inverse); }
    .UiButton.variant-outlined.color-surface {
      border-color: var(--ui-color-surface); }
    .UiButton.variant-outlined.color-primary {
      border-color: var(--ui-color-primary); }
    .UiButton.variant-outlined.color-secondary {
      border-color: var(--ui-color-secondary); }
    .UiButton.variant-outlined.color-success {
      border-color: var(--ui-color-success); }
    .UiButton.variant-outlined.color-error {
      border-color: var(--ui-color-error); }
    .UiButton.variant-outlined.color-info {
      border-color: var(--ui-color-info); }
    .UiButton.variant-outlined.color-warning {
      border-color: var(--ui-color-warning); }
    .UiButton.variant-outlined.color-yellow {
      border-color: var(--ui-color-yellow); }
    .UiButton.variant-outlined.color-text-primary {
      border-color: var(--ui-color-text-primary); }
    .UiButton.variant-outlined.color-text-primary-inverse {
      border-color: var(--ui-color-text-primary-inverse); }
    .UiButton.variant-outlined.color-text-secondary {
      border-color: var(--ui-color-text-secondary); }
    .UiButton.variant-outlined.color-divider {
      border-color: var(--ui-color-divider); }
    .UiButton.variant-outlined.color-black {
      border-color: var(--ui-color-black); }
    .UiButton.variant-outlined.color-white {
      border-color: var(--ui-color-white); }
  .UiButton.variant-filled {
    background-color: var(--UiButton-filled-default-background-color);
    color: var(--ui-color-text-primary); }
    .UiButton.variant-filled.color-body {
      background-color: var(--ui-color-body);
      color: var(--ui-color-body-text); }
    .UiButton.variant-filled.color-body-inverse {
      background-color: var(--ui-color-body-inverse);
      color: var(--ui-color-body-inverse-text); }
    .UiButton.variant-filled.color-surface {
      background-color: var(--ui-color-surface);
      color: var(--ui-color-surface-text); }
    .UiButton.variant-filled.color-primary {
      background-color: var(--ui-color-primary);
      color: var(--ui-color-primary-text); }
    .UiButton.variant-filled.color-secondary {
      background-color: var(--ui-color-secondary);
      color: var(--ui-color-secondary-text); }
    .UiButton.variant-filled.color-success {
      background-color: var(--ui-color-success);
      color: var(--ui-color-success-text); }
    .UiButton.variant-filled.color-error {
      background-color: var(--ui-color-error);
      color: var(--ui-color-error-text); }
    .UiButton.variant-filled.color-info {
      background-color: var(--ui-color-info);
      color: var(--ui-color-info-text); }
    .UiButton.variant-filled.color-warning {
      background-color: var(--ui-color-warning);
      color: var(--ui-color-warning-text); }
    .UiButton.variant-filled.color-yellow {
      background-color: var(--ui-color-yellow);
      color: var(--ui-color-yellow-text); }
    .UiButton.variant-filled.color-text-primary {
      background-color: var(--ui-color-text-primary);
      color: var(--ui-color-text-primary-text); }
    .UiButton.variant-filled.color-text-primary-inverse {
      background-color: var(--ui-color-text-primary-inverse);
      color: var(--ui-color-text-primary-inverse-text); }
    .UiButton.variant-filled.color-text-secondary {
      background-color: var(--ui-color-text-secondary);
      color: var(--ui-color-text-secondary-text); }
    .UiButton.variant-filled.color-divider {
      background-color: var(--ui-color-divider);
      color: var(--ui-color-divider-text); }
    .UiButton.variant-filled.color-black {
      background-color: var(--ui-color-black);
      color: var(--ui-color-black-text); }
    .UiButton.variant-filled.color-white {
      background-color: var(--ui-color-white);
      color: var(--ui-color-white-text); }
  .UiButton.size--1 {
    font-size: var(--UiButton-font-size--1);
    height: var(--ui-size--1);
    padding-left: calc(2 * var(--ui-spacing));
    padding-right: calc(2 * var(--ui-spacing)); }
    .UiButton.size--1.iconCircle {
      height: var(--ui-size--1);
      width: var(--ui-size--1);
      min-width: var(--ui-size--1);
      min-height: var(--ui-size--1); }
  .UiButton.size-0 {
    font-size: var(--UiButton-font-size-0);
    height: var(--ui-size-0);
    padding-left: calc(2 * var(--ui-spacing));
    padding-right: calc(2 * var(--ui-spacing)); }
    .UiButton.size-0.iconCircle {
      height: var(--ui-size-0);
      width: var(--ui-size-0);
      min-width: var(--ui-size-0);
      min-height: var(--ui-size-0); }
  .UiButton.size-1 {
    font-size: var(--UiButton-font-size-1);
    height: var(--ui-size-1);
    padding-left: calc(2 * var(--ui-spacing));
    padding-right: calc(2 * var(--ui-spacing)); }
    .UiButton.size-1.iconCircle {
      height: var(--ui-size-1);
      width: var(--ui-size-1);
      min-width: var(--ui-size-1);
      min-height: var(--ui-size-1); }
  .UiButton.size-2 {
    font-size: var(--UiButton-font-size-2);
    height: var(--ui-size-2);
    padding-left: calc(2 * var(--ui-spacing));
    padding-right: calc(2 * var(--ui-spacing)); }
    .UiButton.size-2.iconCircle {
      height: var(--ui-size-2);
      width: var(--ui-size-2);
      min-width: var(--ui-size-2);
      min-height: var(--ui-size-2); }
  .UiButton.size-3 {
    font-size: var(--UiButton-font-size-3);
    height: var(--ui-size-3);
    padding-left: calc(2 * var(--ui-spacing));
    padding-right: calc(2 * var(--ui-spacing)); }
    .UiButton.size-3.iconCircle {
      height: var(--ui-size-3);
      width: var(--ui-size-3);
      min-width: var(--ui-size-3);
      min-height: var(--ui-size-3); }
  .UiButton > .button-content {
    transition: opacity 200ms;
    position: relative; }
  .UiButton.disabled {
    opacity: 0.5; }
  .UiButton.isLoading .button-content {
    opacity: 0.25; }
  .UiButton:focus {
    outline: none; }
  .UiButton:before {
    background-color: var(--UiButton-hover);
    border-radius: inherit;
    content: '';
    position: absolute;
    top: calc(-1 * 1px);
    left: calc(-1 * 1px);
    height: calc(100% + 2px);
    width: calc(100% + 2px);
    opacity: 0;
    transition: opacity 200ms; }
  .UiButton:focus:before, .UiButton:hover:before {
    opacity: 1; }
  .UiButton .loader {
    position: absolute; }
  .UiButton.fullWidth {
    width: 100%; }
  .UiButton.iconCircle, .UiButton.iconCircle:before {
    border-radius: 100%; }
  .UiButton.iconOnly {
    padding: 0; }
  .UiButton:not(.icon).UiIconMaterial {
    margin-right: 4px;
    font-size: 20px; }

.UiCard {
  background-color: var(--UiCard-background-color);
  border-radius: var(--UiCard-border-radius);
  box-shadow: var(--UiCard-box-shadow); }

.UiContainer {
  max-width: var(--UiContainer-max-width);
  margin: 0 auto; }

html.hide-overflow body {
  overflow: hidden; }

.UiDialog {
  animation-duration: 200ms;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto; }
  .UiDialog,
  .UiDialog .UiDialog-overlay {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: var(--UiDialog-z-index); }
  .UiDialog .UiDialog-overlay {
    background-color: var(--ui-color-overlay); }
  .UiDialog .UiDialog-container {
    max-width: var(--UiDialog-max-width);
    flex-direction: column;
    flex: 1 0 auto;
    padding: calc(2 * var(--ui-spacing));
    position: relative;
    z-index: var(--UiDialog-z-index); }
    .UiDialog .UiDialog-container.maxWidth-100 {
      max-width: 100px; }
    .UiDialog .UiDialog-container.maxWidth-200 {
      max-width: 200px; }
    .UiDialog .UiDialog-container.maxWidth-300 {
      max-width: 300px; }
    .UiDialog .UiDialog-container.maxWidth-400 {
      max-width: 400px; }
    .UiDialog .UiDialog-container.maxWidth-500 {
      max-width: 500px; }
    .UiDialog .UiDialog-container.maxWidth-600 {
      max-width: 600px; }
    .UiDialog .UiDialog-container.maxWidth-700 {
      max-width: 700px; }
    .UiDialog .UiDialog-container.maxWidth-800 {
      max-width: 800px; }
    .UiDialog .UiDialog-container.maxWidth-900 {
      max-width: 900px; }
  .UiDialog .UiDialog-content {
    max-height: calc(100vh - (2 * var(--ui-spacing))); }
  .UiDialog.fullScreen .UiDialog-container,
  .UiDialog.fullScreen .UiDialog-content {
    width: 100vw;
    max-width: 100vw;
    height: calc(100vh - calc(100vh - 100%));
    max-height: 100vh;
    padding: 0; }
  .UiDialog.fullScreen .UiDialog-content {
    background-color: var(--ui-color-surface); }

.UiExampleSidebar {
  width: 240px;
  max-width: 240px; }
  .UiExampleSidebar .UiButton {
    border-radius: 0 40px 40px 0;
    justify-content: flex-start; }
    .UiExampleSidebar .UiButton.variant-text {
      color: var(--ui-color-text-secondary); }

.UiExample-image {
  height: 320px;
  width: 320px; }

.UiFlex {
  display: flex; }
  .UiFlex.flexChildren > * {
    flex: 1; }
  .UiFlex.wrap-nowrap {
    flex-wrap: nowrap; }
  .UiFlex.wrap-wrap {
    flex-wrap: wrap; }
  .UiFlex.direction-row {
    flex-direction: row; }
  .UiFlex.direction-column {
    flex-direction: column; }
  .UiFlex.alignItems-flex-start {
    align-items: flex-start; }
  .UiFlex.alignItems-baseline {
    align-items: baseline; }
  .UiFlex.alignItems-center {
    align-items: center; }
  .UiFlex.alignItems-flex-end {
    align-items: flex-end; }
  .UiFlex.alignItems-stretch {
    align-items: stretch; }
  .UiFlex.justifyContent-flex-start {
    justify-content: flex-start; }
  .UiFlex.justifyContent-baseline {
    justify-content: baseline; }
  .UiFlex.justifyContent-center {
    justify-content: center; }
  .UiFlex.justifyContent-flex-end {
    justify-content: flex-end; }
  .UiFlex.justifyContent-space-between {
    justify-content: space-between; }
  .UiFlex.direction-row {
    flex-direction: row; }
    .UiFlex.direction-row.gap-1 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 1); }
    .UiFlex.direction-row.gap-2 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 2); }
    .UiFlex.direction-row.gap-3 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 3); }
    .UiFlex.direction-row.gap-4 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 4); }
    .UiFlex.direction-row.gap-5 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 5); }
    .UiFlex.direction-row.gap-6 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 6); }
    .UiFlex.direction-row.gap-7 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 7); }
    .UiFlex.direction-row.gap-8 > *:not(:first-child) {
      margin-left: calc(var(--ui-spacing) * 8); }
  .UiFlex.direction-column {
    flex-direction: column; }
    .UiFlex.direction-column.gap-1 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 1); }
    .UiFlex.direction-column.gap-2 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 2); }
    .UiFlex.direction-column.gap-3 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 3); }
    .UiFlex.direction-column.gap-4 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 4); }
    .UiFlex.direction-column.gap-5 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 5); }
    .UiFlex.direction-column.gap-6 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 6); }
    .UiFlex.direction-column.gap-7 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 7); }
    .UiFlex.direction-column.gap-8 > *:not(:first-child) {
      margin-top: calc(var(--ui-spacing) * 8); }
  .UiFlex.flex-1 {
    flex: 1; }
  .UiFlex.flex-2 {
    flex: 2; }
  .UiFlex.flex-3 {
    flex: 3; }
  .UiFlex.flex-4 {
    flex: 4; }
  .UiFlex.flex-5 {
    flex: 5; }
  .UiFlex.flex-6 {
    flex: 6; }
  .UiFlex.flex-7 {
    flex: 7; }
  .UiFlex.flex-8 {
    flex: 8; }
  .UiFlex.flex-9 {
    flex: 9; }
  .UiFlex.flex-10 {
    flex: 10; }
  .UiFlex.flex-11 {
    flex: 11; }
  .UiFlex.flex-12 {
    flex: 12; }

.UiImage {
  transition: opacity 500ms;
  opacity: 0; }
  .UiImage.circle {
    border-radius: 100%; }
  .UiImage.type-fill, .UiImage.type-contain, .UiImage.type-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .UiImage.type-fill {
    object-fit: fill; }
  .UiImage.type-cover {
    object-fit: cover; }
  .UiImage.type-contain {
    object-fit: contain; }
  .UiImage.isLoaded {
    opacity: 1; }

.UiGrid {
  display: grid;
  grid-template-columns: repeat(1, 1fr); }
  .UiGrid.gap-1 {
    grid-gap: calc(var(--ui-spacing) * 1); }
  .UiGrid.gap-2 {
    grid-gap: calc(var(--ui-spacing) * 2); }
  .UiGrid.gap-3 {
    grid-gap: calc(var(--ui-spacing) * 3); }
  .UiGrid.gap-4 {
    grid-gap: calc(var(--ui-spacing) * 4); }
  .UiGrid.gap-5 {
    grid-gap: calc(var(--ui-spacing) * 5); }
  .UiGrid.gap-6 {
    grid-gap: calc(var(--ui-spacing) * 6); }
  .UiGrid.gap-7 {
    grid-gap: calc(var(--ui-spacing) * 7); }
  .UiGrid.gap-8 {
    grid-gap: calc(var(--ui-spacing) * 8); }
  .UiGrid.gap-9 {
    grid-gap: calc(var(--ui-spacing) * 9); }
  .UiGrid.gap-10 {
    grid-gap: calc(var(--ui-spacing) * 10); }
  .UiGrid.gap-11 {
    grid-gap: calc(var(--ui-spacing) * 11); }
  .UiGrid.gap-12 {
    grid-gap: calc(var(--ui-spacing) * 12); }
  .UiGrid.gap-13 {
    grid-gap: calc(var(--ui-spacing) * 13); }
  .UiGrid.gap-14 {
    grid-gap: calc(var(--ui-spacing) * 14); }
  .UiGrid.gap-15 {
    grid-gap: calc(var(--ui-spacing) * 15); }
  .UiGrid.gap-16 {
    grid-gap: calc(var(--ui-spacing) * 16); }

.UiInput > *:not(:first-child) {
  display: block;
  margin-top: var(--ui-spacing); }

.UiInput.fullWidth {
  width: 100%; }

.UiInput.hasValue .label {
  opacity: 1; }

.UiInput.hasError {
  color: var(--ui-color-error); }
  .UiInput.hasError .input-container {
    border-color: var(--ui-color-error); }

.UiInput.type-boolean .button-boolean {
  justify-content: flex-start; }

.UiInput:not(.type-textarea).size--1 .input-container,
.UiInput:not(.type-textarea).size--1 .input-container input,
.UiInput:not(.type-textarea).size--1 .input-container select {
  min-height: var(--ui-size--1); }
  .UiInput:not(.type-textarea).size--1 .input-container.iconCircle,
  .UiInput:not(.type-textarea).size--1 .input-container input.iconCircle,
  .UiInput:not(.type-textarea).size--1 .input-container select.iconCircle {
    height: var(--ui-size--1);
    width: var(--ui-size--1);
    min-width: var(--ui-size--1);
    min-height: var(--ui-size--1); }

.UiInput:not(.type-textarea).size--1 .input-container select {
  height: var(--ui-size--1); }

.UiInput:not(.type-textarea).size-0 .input-container,
.UiInput:not(.type-textarea).size-0 .input-container input,
.UiInput:not(.type-textarea).size-0 .input-container select {
  min-height: var(--ui-size-0); }
  .UiInput:not(.type-textarea).size-0 .input-container.iconCircle,
  .UiInput:not(.type-textarea).size-0 .input-container input.iconCircle,
  .UiInput:not(.type-textarea).size-0 .input-container select.iconCircle {
    height: var(--ui-size-0);
    width: var(--ui-size-0);
    min-width: var(--ui-size-0);
    min-height: var(--ui-size-0); }

.UiInput:not(.type-textarea).size-0 .input-container select {
  height: var(--ui-size-0); }

.UiInput:not(.type-textarea).size-1 .input-container,
.UiInput:not(.type-textarea).size-1 .input-container input,
.UiInput:not(.type-textarea).size-1 .input-container select {
  min-height: var(--ui-size-1); }
  .UiInput:not(.type-textarea).size-1 .input-container.iconCircle,
  .UiInput:not(.type-textarea).size-1 .input-container input.iconCircle,
  .UiInput:not(.type-textarea).size-1 .input-container select.iconCircle {
    height: var(--ui-size-1);
    width: var(--ui-size-1);
    min-width: var(--ui-size-1);
    min-height: var(--ui-size-1); }

.UiInput:not(.type-textarea).size-1 .input-container select {
  height: var(--ui-size-1); }

.UiInput:not(.type-textarea).size-2 .input-container,
.UiInput:not(.type-textarea).size-2 .input-container input,
.UiInput:not(.type-textarea).size-2 .input-container select {
  min-height: var(--ui-size-2); }
  .UiInput:not(.type-textarea).size-2 .input-container.iconCircle,
  .UiInput:not(.type-textarea).size-2 .input-container input.iconCircle,
  .UiInput:not(.type-textarea).size-2 .input-container select.iconCircle {
    height: var(--ui-size-2);
    width: var(--ui-size-2);
    min-width: var(--ui-size-2);
    min-height: var(--ui-size-2); }

.UiInput:not(.type-textarea).size-2 .input-container select {
  height: var(--ui-size-2); }

.UiInput:not(.type-textarea).size-3 .input-container,
.UiInput:not(.type-textarea).size-3 .input-container input,
.UiInput:not(.type-textarea).size-3 .input-container select {
  min-height: var(--ui-size-3); }
  .UiInput:not(.type-textarea).size-3 .input-container.iconCircle,
  .UiInput:not(.type-textarea).size-3 .input-container input.iconCircle,
  .UiInput:not(.type-textarea).size-3 .input-container select.iconCircle {
    height: var(--ui-size-3);
    width: var(--ui-size-3);
    min-width: var(--ui-size-3);
    min-height: var(--ui-size-3); }

.UiInput:not(.type-textarea).size-3 .input-container select {
  height: var(--ui-size-3); }

.UiInput .input-container {
  position: relative;
  font-size: var(--UiInput-font-size);
  min-width: 64px;
  transition: border 200ms;
  background-color: var(--UiInput-background-color);
  border-radius: var(--ui-border-radius);
  border: 1px solid transparent; }

.UiInput input,
.UiInput select,
.UiInput textarea {
  color: inherit;
  background-color: transparent;
  border: 0;
  box-shadow: none;
  outline: none;
  font-family: inherit;
  height: 100%;
  flex: 1;
  z-index: 1;
  max-width: 100%;
  margin: 0 var(--ui-spacing);
  padding: 0; }
  .UiInput input::placeholder,
  .UiInput select::placeholder,
  .UiInput textarea::placeholder {
    height: inherit; }

.UiInput textarea {
  max-width: 100%;
  min-height: calc(var(--ui-size-0) * 2);
  padding: calc(var(--ui-spacing) * 2);
  margin: 0; }

.UiInput select {
  background-color: transparent;
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  padding: 0 calc(2 * var(--ui-spacing)); }
  .UiInput select option {
    background-color: var(--ui-color-surface);
    color: var(--ui-color-text-primary); }

.UiInput .arrow-drop-down {
  position: absolute;
  right: 0; }

.UiInput .label {
  position: absolute;
  transition: 200ms;
  z-index: 2;
  padding: 0 4px;
  background: var(--ui-color-surface);
  font-size: 10px;
  font-weight: bold;
  border-radius: var(--ui-border-radius);
  opacity: 0;
  top: calc(-1 * var(--ui-spacing));
  left: var(--ui-spacing); }

.UiLoader.color-body > div {
  background-color: var(--ui-color-body); }

.UiLoader.color-body-inverse > div {
  background-color: var(--ui-color-body-inverse); }

.UiLoader.color-surface > div {
  background-color: var(--ui-color-surface); }

.UiLoader.color-primary > div {
  background-color: var(--ui-color-primary); }

.UiLoader.color-secondary > div {
  background-color: var(--ui-color-secondary); }

.UiLoader.color-success > div {
  background-color: var(--ui-color-success); }

.UiLoader.color-error > div {
  background-color: var(--ui-color-error); }

.UiLoader.color-info > div {
  background-color: var(--ui-color-info); }

.UiLoader.color-warning > div {
  background-color: var(--ui-color-warning); }

.UiLoader.color-yellow > div {
  background-color: var(--ui-color-yellow); }

.UiLoader.color-text-primary > div {
  background-color: var(--ui-color-text-primary); }

.UiLoader.color-text-primary-inverse > div {
  background-color: var(--ui-color-text-primary-inverse); }

.UiLoader.color-text-secondary > div {
  background-color: var(--ui-color-text-secondary); }

.UiLoader.color-divider > div {
  background-color: var(--ui-color-divider); }

.UiLoader.color-black > div {
  background-color: var(--ui-color-black); }

.UiLoader.color-white > div {
  background-color: var(--ui-color-white); }

.UiLoader > div {
  border-radius: 100%;
  margin: 0;
  animation-fill-mode: both;
  display: inline-block;
  animation: ball-beat 0.7s 0s infinite linear; }
  .UiLoader > div:not(:first-child) {
    margin-left: 4px; }
  .UiLoader > div:nth-child(2n-1) {
    animation-delay: -0.35s !important; }

@keyframes ball-beat {
  50% {
    opacity: 0.2;
    transform: scale(0.75); }
  100% {
    opacity: 1;
    transform: scale(1); } }

.UiTable {
  overflow: auto; }
  .UiTable table {
    width: 100%;
    border-spacing: 0; }
    .UiTable table thead {
      color: var(--UiTable-header-text-color); }
    .UiTable table thead,
    .UiTable table tfoot {
      font-size: 0.625rem;
      font-weight: bold;
      text-transform: uppercase; }
    .UiTable table td {
      padding: var(--ui-spacing);
      border-bottom: 1px solid var(--UiTable-row-divider-color); }
      .UiTable table td.no-padding {
        padding: 0; }

.UiText.fontSize--4 {
  font-size: var(--UiText-font-size--4); }

.UiText.fontSize--3 {
  font-size: var(--UiText-font-size--3); }

.UiText.fontSize--2 {
  font-size: var(--UiText-font-size--2); }

.UiText.fontSize--1 {
  font-size: var(--UiText-font-size--1); }

.UiText.fontSize-0 {
  font-size: var(--UiText-font-size-0); }

.UiText.fontSize-1 {
  font-size: var(--UiText-font-size-1); }

.UiText.fontSize-2 {
  font-size: var(--UiText-font-size-2); }

.UiText.fontSize-3 {
  font-size: var(--UiText-font-size-3); }

.UiText.fontSize-4 {
  font-size: var(--UiText-font-size-4); }

.UiText.fontSize-5 {
  font-size: var(--UiText-font-size-5); }

.UiText.fontSize-6 {
  font-size: var(--UiText-font-size-6); }

.UiText.fontSize-7 {
  font-size: var(--UiText-font-size-7); }

.UiText.fontSize-8 {
  font-size: var(--UiText-font-size-8); }

.UiText.fontSize-9 {
  font-size: var(--UiText-font-size-9); }

.UiText.fontSize-3 {
  font-weight: 300; }

.UiText.fontSize-4 {
  font-weight: 300; }

.UiText.fontSize-5 {
  font-weight: 300; }

.UiText.fontSize-6 {
  font-weight: 200; }

.UiText.fontSize-7 {
  font-weight: 200; }

.UiText.fontSize-8 {
  font-weight: 200; }

.UiText.fontSize-9 {
  font-weight: 200; }

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

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

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

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

.UiText.weight--3 {
  font-weight: 100; }

.UiText.weight--2 {
  font-weight: 200; }

.UiText.weight--1 {
  font-weight: 300; }

.UiText.weight-0 {
  font-weight: 400; }

.UiText.weight-1 {
  font-weight: 500; }

.UiText.weight-2 {
  font-weight: 600; }

.UiText.weight-3 {
  font-weight: 700; }

.UiText.weight-4 {
  font-weight: 800; }

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

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

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

.UiText.noWrap {
  white-space: nowrap; }

.UiText.color-body {
  color: var(--ui-color-body); }

.UiText.color-body-inverse {
  color: var(--ui-color-body-inverse); }

.UiText.color-surface {
  color: var(--ui-color-surface); }

.UiText.color-primary {
  color: var(--ui-color-primary); }

.UiText.color-secondary {
  color: var(--ui-color-secondary); }

.UiText.color-success {
  color: var(--ui-color-success); }

.UiText.color-error {
  color: var(--ui-color-error); }

.UiText.color-info {
  color: var(--ui-color-info); }

.UiText.color-warning {
  color: var(--ui-color-warning); }

.UiText.color-yellow {
  color: var(--ui-color-yellow); }

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

.UiText.color-text-primary-inverse {
  color: var(--ui-color-text-primary-inverse); }

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

.UiText.color-divider {
  color: var(--ui-color-divider); }

.UiText.color-black {
  color: var(--ui-color-black); }

.UiText.color-white {
  color: var(--ui-color-white); }

.UiToggle {
  background-color: var(--ui-color-body);
  padding: calc(0.5 * var(--ui-spacing));
  position: relative;
  border-radius: var(--ui-border-radius);
  border: 1px solid var(--ui-color-divider); }
  .UiToggle > .content {
    border-radius: var(--ui-border-radius);
    position: relative; }
  .UiToggle button {
    height: 100%; }
    .UiToggle button.active {
      color: var(--ui-color-white); }
    .UiToggle button:not(.indicator) {
      z-index: 1; }
      .UiToggle button:not(.indicator):before {
        display: none; }
  .UiToggle .indicator {
    background-color: var(--ui-color-secondary);
    position: absolute;
    top: 0;
    left: 0;
    transition: transform 200ms; }
    .UiToggle .indicator.buttons-1 {
      width: calc(100% / 1); }
    .UiToggle .indicator.buttons-2 {
      width: calc(100% / 2); }
    .UiToggle .indicator.buttons-3 {
      width: calc(100% / 3); }
    .UiToggle .indicator.buttons-4 {
      width: calc(100% / 4); }
    .UiToggle .indicator.buttons-5 {
      width: calc(100% / 5); }
    .UiToggle .indicator.buttons-6 {
      width: calc(100% / 6); }
    .UiToggle .indicator.buttons-7 {
      width: calc(100% / 7); }
    .UiToggle .indicator.buttons-8 {
      width: calc(100% / 8); }
    .UiToggle .indicator.buttons-9 {
      width: calc(100% / 9); }
    .UiToggle .indicator.buttons-10 {
      width: calc(100% / 10); }
    .UiToggle .indicator.active-0 {
      transform: translateX(0%); }
    .UiToggle .indicator.active-1 {
      transform: translateX(100%); }
    .UiToggle .indicator.active-2 {
      transform: translateX(200%); }
    .UiToggle .indicator.active-3 {
      transform: translateX(300%); }
    .UiToggle .indicator.active-4 {
      transform: translateX(400%); }
    .UiToggle .indicator.active-5 {
      transform: translateX(500%); }
    .UiToggle .indicator.active-6 {
      transform: translateX(600%); }
    .UiToggle .indicator.active-7 {
      transform: translateX(700%); }
    .UiToggle .indicator.active-8 {
      transform: translateX(800%); }
    .UiToggle .indicator.active-9 {
      transform: translateX(900%); }
    .UiToggle .indicator.active-10 {
      transform: translateX(1000%); }

.UiCardFooter {
  min-height: var(--ui-size-3); }

.UiCardHeader {
  min-height: var(--ui-size-3); }

.UiIconMaterial {
  color: inherit; }
.adyen-checkout__spinner__wrapper{align-items:center;display:flex;height:100%;justify-content:center}.adyen-checkout__spinner__wrapper--inline{display:inline-block;height:auto;margin-right:8px}[dir=rtl] .adyen-checkout__spinner__wrapper--inline{margin-left:8px;margin-right:0}.adyen-checkout__spinner{-webkit-animation:rotateSpinner 1.5s linear infinite;animation:rotateSpinner 1.5s linear infinite;border:3px solid #06f;border-radius:50%;border-top-color:transparent;height:43px;width:43px}.adyen-checkout__spinner--large{height:43px;width:43px}.adyen-checkout__spinner--small{border-width:2px;height:16px;width:16px}.adyen-checkout__spinner--medium{height:28px;width:28px}@-webkit-keyframes rotateSpinner{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes rotateSpinner{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
.adyen-checkout__button{background:#00112c;border:0;border-radius:6px;color:#fff;cursor:pointer;font-size:1em;font-weight:500;height:48px;margin:0;padding:15px;text-decoration:none;transition:background .3s ease-out,box-shadow .3s ease-out;width:100%}.adyen-checkout__button:focus{box-shadow:0 0 0 2px #99c2ff;outline:0}.adyen-checkout__button:hover{background:#1c3045;box-shadow:0 0,0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14)}.adyen-checkout__button:active{background:#3a4a5c}.adyen-checkout__button:hover:focus{box-shadow:0 0 0 2px #99c2ff,0 3px 4px rgba(0,15,45,.2)}.adyen-checkout__button:disabled,.adyen-checkout__button:disabled:hover{box-shadow:none;cursor:not-allowed;opacity:.4;-webkit-user-select:all;-moz-user-select:all;user-select:all}.adyen-checkout__button.adyen-checkout__button--loading{background:#687282;box-shadow:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adyen-checkout__button.adyen-checkout__button--pay{margin-top:24px}.adyen-checkout__button.adyen-checkout__button--pay:disabled{opacity:1}.adyen-checkout__button.adyen-checkout__button--standalone{margin-top:0}.adyen-checkout__button.adyen-checkout__button--inline{display:block;font-size:.81em;height:auto;padding:10px 8px;width:auto}.adyen-checkout__button.adyen-checkout__button--ghost{background:none;border:0;color:#00112c}.adyen-checkout__button.adyen-checkout__button--ghost:hover{background:#f7f8f9;box-shadow:none}.adyen-checkout__button.adyen-checkout__button--ghost:active{background:#e6e9eb;box-shadow:none}.adyen-checkout__button.adyen-checkout__button--secondary{background:rgba(0,102,255,.1);border:1px solid transparent;color:#06f;padding:10px 12px}.adyen-checkout__button.adyen-checkout__button--secondary:hover{background:rgba(0,102,255,.2);box-shadow:none}.adyen-checkout__button.adyen-checkout__button--secondary:active,.adyen-checkout__button.adyen-checkout__button--secondary:active:hover{background:rgba(0,102,255,.3);box-shadow:none}.adyen-checkout__button.adyen-checkout__button--link{background:transparent;border:1px solid transparent;border-radius:3px;color:#06f;font-weight:400;padding:2px}.adyen-checkout__button.adyen-checkout__button--link:hover{background:transparent;box-shadow:none;text-decoration:underline}.adyen-checkout__button.adyen-checkout__button--completed,.adyen-checkout__button.adyen-checkout__button--completed:active,.adyen-checkout__button.adyen-checkout__button--completed:active:hover,.adyen-checkout__button.adyen-checkout__button--completed:hover{background:#0abf53;color:#fff}.adyen-checkout__button.adyen-checkout__button--completed .adyen-checkout__button__icon{filter:brightness(0) invert(1)}.adyen-checkout__button__content{align-items:center;display:flex;height:100%;justify-content:center}.adyen-checkout__button__icon{margin-right:12px}[dir=rtl] .adyen-checkout__button__icon{margin-left:12px;margin-right:0}.adyen-checkout__button__text{display:block;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.adyen-checkout__button .adyen-checkout__spinner{border-color:transparent #fff #fff}
.adyen-checkout__fieldset{display:block;padding-bottom:8px;width:100%}.adyen-checkout__fieldset:last-of-type{padding-bottom:0}.adyen-checkout__fieldset+.adyen-checkout__fieldset{margin-top:16px}.adyen-checkout__fieldset__title{color:#687282;display:block;font-size:.68em;font-weight:700;letter-spacing:1px;margin:0;padding:0 0 12px;text-transform:uppercase}.adyen-checkout__field-group,.adyen-checkout__fieldset__fields{display:flex;flex-wrap:wrap;justify-content:space-between;width:100%}.adyen-checkout__field-group:last-of-type .adyen-checkout__field{margin-bottom:0}.adyen-checkout__fieldset--readonly .adyen-checkout__fieldset__fields{color:#00112c;font-size:.81em;line-height:19px;margin:0}
.adyen-checkout__field{display:block;margin-bottom:16px;width:100%}.adyen-checkout__field:last-of-type{margin-bottom:0}.adyen-checkout__label{display:block}.adyen-checkout__helper-text,.adyen-checkout__label__text{color:#00112c;display:block;font-size:.81em;font-weight:400;line-height:13px;padding-bottom:5px}.adyen-checkout__helper-text{color:#687282}.adyen-checkout__label__text{display:block;overflow:hidden;text-overflow:ellipsis;transition:color .1s ease-out;white-space:nowrap}.adyen-checkout__label__text--error{color:#d10244}.adyen-checkout__label--focused .adyen-checkout__label__text{color:#06f}.adyen-checkout__error-text{align-items:center;color:#d10244;display:flex;font-size:.75em;font-weight:400;margin-top:4px}
.adyen-checkout__radio_group+.adyen-checkout-input__inline-validation{display:none}.adyen-checkout__radio_group__input{opacity:0;position:absolute}.adyen-checkout__radio_group__label{color:inherit;display:block;font-size:.81em;font-weight:400;line-height:16px;overflow:visible;padding-bottom:0;padding-left:24px;position:relative}.adyen-checkout__label--focused .adyen-checkout__radio_group__label{color:inherit}.adyen-checkout__radio_group__label:before{background-color:#fff;border:1px solid #b9c4c9;border-radius:50%;content:"";height:16px;left:0;position:absolute;top:0;transition:border-color .2s ease-out,box-shadow .2s ease-out;width:16px}.adyen-checkout__radio_group__label:hover:before{border-color:#99a3ad;box-shadow:0 0 0 2px #d4d9db;cursor:pointer}.adyen-checkout__radio_group__label:after{background-color:#fff;border-radius:50%;box-shadow:0 1px 1px rgba(0,15,45,.25);content:"";display:block;height:6px;left:5px;margin:0 auto;position:absolute;top:5px;transform:scale(0);transition:transform .2s ease-out;width:6px}.adyen-checkout__radio_group__label:hover{border-color:#06f;cursor:pointer}.adyen-checkout__radio_group__input:checked+.adyen-checkout__radio_group__label:before,.adyen-checkout__radio_group__label--selected{background-color:#06f;border:0;transition:all .2s ease-out}.adyen-checkout__radio_group__input:checked+.adyen-checkout__radio_group__label:after{transform:scale(1)}.adyen-checkout__radio_group__input:focus+.adyen-checkout__radio_group__label:before{border-color:#06f;box-shadow:0 0 0 2px rgba(0,102,255,.4)}.adyen-checkout__radio_group__input:checked+.adyen-checkout__radio_group__label:hover:before,.adyen-checkout__radio_group__input:checked:active+.adyen-checkout__radio_group__label:before,.adyen-checkout__radio_group__input:checked:focus+.adyen-checkout__radio_group__label:before{box-shadow:0 0 0 2px rgba(0,102,255,.4)}.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid:before{border:1px solid #d10244}
.adyen-checkout__checkbox{display:block}.adyen-checkout__checkbox__label{color:#00112c;cursor:pointer;display:inline-block;font-size:.81em;font-weight:400;line-height:19px;padding-left:24px;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[dir=rtl] .adyen-checkout__checkbox__label{padding-left:0;padding-right:24px}.adyen-checkout__checkbox__input{opacity:0;pointer-events:none;position:absolute}.adyen-checkout__checkbox__input:checked+.adyen-checkout__checkbox__label:before{opacity:1}.adyen-checkout__checkbox__input:checked+.adyen-checkout__checkbox__label:after{background-color:#06f;border:1px solid #06f}.adyen-checkout__checkbox__input:checked:hover+.adyen-checkout__checkbox__label:after{border-color:#06f;box-shadow:0 0 0 2px rgba(0,102,255,.4)}.adyen-checkout__checkbox__input:focus+.adyen-checkout__checkbox__label:after{border:1px solid #06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__checkbox__input:hover:not(:focus)+.adyen-checkout__checkbox__label:after{border-color:#99a3ad;box-shadow:0 0 0 2px #d4d9db}.adyen-checkout__checkbox__input+.adyen-checkout__checkbox__label:before{border-bottom:1px solid transparent;border-right:1px solid transparent;border-color:transparent #fff #fff transparent;border-radius:0 2px 1px 2px;border-style:solid;border-width:1px 2px 2px 1px;content:"";height:11px;left:1px;opacity:0;position:absolute;top:2px;transform:rotate(37deg);transform-origin:100% 100%;transition:opacity .2s ease-out;width:6px;z-index:1}[dir=rtl] .adyen-checkout__checkbox__input+.adyen-checkout__checkbox__label:before{left:auto;right:8px}.adyen-checkout__checkbox__input+.adyen-checkout__checkbox__label:after{background-color:#fff;border:1px solid #b9c4c9;border-radius:3px;content:"";height:16px;left:0;position:absolute;top:0;transition:background .15s ease-out,border .05s ease-out,box-shadow .1s ease-out;width:16px;z-index:0}[dir=rtl] .adyen-checkout__checkbox__input+.adyen-checkout__checkbox__label:after{left:auto;right:0}.adyen-checkout__field--consentCheckbox{background:#e6e9eb;border:1px solid #e6e9eb;border-radius:6px;padding:14px 14px 13px}[dir=rtl] .adyen-checkout__field--consentCheckbox{padding:14px 14px 13px}.adyen-checkout__field--consentCheckbox.adyen-checkout__field--error{border-color:#d10244}.adyen-checkout__field--consentCheckbox .adyen-checkout-input__inline-validation{right:-27px;top:10px}
.Select-module_adyen-checkout__dropdown__2kGp2{position:relative}.Select-module_adyen-checkout__dropdown__button__waz0I{align-items:center;cursor:pointer;display:flex;justify-content:space-between}.Select-module_adyen-checkout__dropdown__button__waz0I:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.195 6.565a1 1 0 0 0 1.6 0l2.992-3.98a1 1 0 0 0-.8-1.602H1.013a1 1 0 0 0-.8 1.6l2.983 3.982z' fill='%23687282'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;content:"";height:6px;position:absolute;right:16px;width:8px}[dir=rtl] .Select-module_adyen-checkout__dropdown__button__waz0I:after{left:16px;right:auto}.Select-module_adyen-checkout__dropdown__button--active__1EqeU:after{transform:rotate(180deg)}.Select-module_adyen-checkout__filter-input__HMjy5{background:#fff;border:0;caret-color:#06f;color:#00112c;font-family:inherit;font-size:1em;height:100%;padding:0;width:100%}.Select-module_adyen-checkout__filter-input__HMjy5::-moz-placeholder{color:#b9c4c9;font-weight:200}.Select-module_adyen-checkout__filter-input__HMjy5:-ms-input-placeholder{color:#b9c4c9;font-weight:200}.Select-module_adyen-checkout__filter-input__HMjy5::placeholder{color:#b9c4c9;font-weight:200}.Select-module_adyen-checkout__filter-input__HMjy5:active,.Select-module_adyen-checkout__filter-input__HMjy5:focus{outline:0}.Select-module_adyen-checkout__dropdown__list__2UxAp{background:#fff;display:none;list-style:none;margin:0 0 50px;overflow-y:auto;padding:0;position:absolute;width:100%;z-index:1}.Select-module_adyen-checkout__dropdown__list__2UxAp.Select-module_adyen-checkout__dropdown__list--active__Mlt8t{display:block}.Select-module_adyen-checkout__dropdown__element__3nIQR{align-items:center;display:flex;justify-content:space-between}
.adyen-checkout__image{opacity:0;transition:opacity .6s ease-out}.adyen-checkout__image--loaded{opacity:1}
.adyen-checkout__dropdown{font-size:1em;max-width:100%;width:100%}.adyen-checkout__dropdown__button{background:#fff;border:1px solid #b9c4c9;border-radius:6px;color:#00112c;font-size:1em;height:40px;line-height:20px;outline:0;padding:7px 24px 7px 12px;text-decoration:none;transition:border .2s ease-out,box-shadow .2s ease-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}[dir=rtl] .adyen-checkout__dropdown__button{padding:7px 12px 7px 24px}.adyen-checkout__dropdown__button:hover{border-color:#99a3ad}.adyen-checkout__dropdown__button__icon{border-radius:3px;height:26px;margin-left:auto;margin-right:8px;max-width:40px}.adyen-checkout__dropdown__button--active,.adyen-checkout__dropdown__button--active:hover,.adyen-checkout__dropdown__button:active,.adyen-checkout__dropdown__button:focus{border-color:#06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__dropdown__button--readonly,.adyen-checkout__dropdown__button--readonly--active,.adyen-checkout__dropdown__button--readonly:focus,.adyen-checkout__dropdown__button--readonly:hover{background:#e6e9eb;border-color:transparent;color:#00112c;cursor:not-allowed}.adyen-checkout__dropdown__button--readonly:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.195 6.565a1 1 0 0 0 1.6 0l2.992-3.98a1 1 0 0 0-.8-1.602H1.013a1 1 0 0 0-.8 1.6l2.983 3.982z' fill='%23B9C4C9'/%3E%3C/svg%3E")}.adyen-checkout__dropdown__button--invalid{border-color:#d10244}.adyen-checkout__dropdown__button--valid{border-bottom-color:#0abf53}.adyen-checkout__dropdown__button__text{overflow:hidden;pointer-events:none;text-overflow:ellipsis;white-space:nowrap}.adyen-checkout__dropdown__list{border-radius:6px;box-shadow:0 2px 7px rgba(0,15,45,.3);max-height:375px;z-index:2}.adyen-checkout__dropdown__list.adyen-checkout__dropdown__list--active{margin-top:2px}.adyen-checkout__dropdown__element{border:1px solid transparent;cursor:pointer;font-size:.81em;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;line-height:20px;outline:0;padding:8px;transition:background .2s ease-out,border-color .2s ease-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;word-break:break-word}.adyen-checkout__dropdown__element:last-child{border-bottom:0}.adyen-checkout__dropdown__element:active,.adyen-checkout__dropdown__element:focus,.adyen-checkout__dropdown__element:hover{background:rgba(230,233,235,.6)}.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active{background:rgba(0,102,255,.1)}.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active:active,.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active:focus,.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active:hover{background:rgba(0,102,255,.15)}.adyen-checkout__dropdown__element--disabled{cursor:not-allowed;opacity:.4}.adyen-checkout__dropdown__element__icon{border-radius:3px;margin-right:8px;max-height:26px;max-width:40px}.adyen-checkout__dropdown__element__flag{margin-left:8px;margin-right:10px;max-height:18px;max-width:27px}.adyen-checkout__dropdown+.adyen-checkout-input__inline-validation{right:32px}
.adyen-checkout__field-wrapper{display:flex;width:100%}.adyen-checkout__field--20{width:20%}.adyen-checkout__field--30{width:30%}.adyen-checkout__field--40{width:40%}.adyen-checkout__field--50{width:50%}.adyen-checkout__field--60{width:60%}.adyen-checkout__field--70{width:70%}.adyen-checkout__field--80{width:80%}.adyen-checkout__field--col-70{width:calc(70% - 8px)}.adyen-checkout__field--col-30{width:calc(30% - 8px)}.adyen-checkout__field--col-50{width:calc(50% - 8px)}.adyen-checkout__field-wrapper>.adyen-checkout__field:first-child{margin-right:8px}[dir=rtl] .adyen-checkout__field-wrapper>.adyen-checkout__field:first-child{margin-left:8px;margin-right:0}.adyen-checkout__field-wrapper>.adyen-checkout__field:nth-child(2){margin-left:8px}[dir=rtl] .adyen-checkout__field-wrapper>.adyen-checkout__field:nth-child(2){margin-left:0;margin-right:8px}.adyen-checkout__field-wrapper:last-of-type>.adyen-checkout__field{margin-bottom:0}.adyen-checkout__input{background:#fff;border:1px solid #b9c4c9;border-radius:6px;caret-color:#06f;color:#00112c;display:block;font-family:inherit;font-size:1em;height:40px;outline:none;padding:5px 8px;position:relative;transition:border .2s ease-out,box-shadow .2s ease-out;width:100%}.adyen-checkout__input:hover{border-color:#99a3ad}.adyen-checkout__input:required{box-shadow:none}.adyen-checkout__input--disabled,.adyen-checkout__input[readonly]{background:#e6e9eb;border-color:#e6e9eb}.adyen-checkout__input--disabled:hover{border-color:#e6e9eb}.adyen-checkout__input-wrapper{display:block;position:relative}.adyen-checkout__input-wrapper--block{display:block}.adyen-checkout-input__inline-validation{height:16px;position:absolute;right:14px;top:50%;transform:translateY(-50%);width:16px}[dir=rtl] .adyen-checkout-input__inline-validation{left:14px;right:auto}[dir=ltr] .adyen-checkout-input__inline-validation{left:auto;right:14px}.adyen-checkout-input__inline-validation--valid{color:#0abf53}.adyen-checkout-input__inline-validation--invalid{color:#d10244}.adyen-checkout__input--invalid{border-color:#d10244}.adyen-checkout__input--valid{border-bottom-color:#0abf53}.adyen-checkout__input--error,.adyen-checkout__input--error:hover,.adyen-checkout__input--invalid,.adyen-checkout__input--invalid:hover{border-color:#d10244}.adyen-checkout__input::-moz-placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input:-ms-input-placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input::placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input--date{padding-right:30px}.adyen-checkout__input--focus,.adyen-checkout__input--focus:hover,.adyen-checkout__input:active,.adyen-checkout__input:active:hover,.adyen-checkout__input:focus,.adyen-checkout__input:focus:hover{border:1px solid #06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__input[readonly],.adyen-checkout__input[readonly]:hover{background-color:#e6e9eb;border-color:transparent;color:#687282;cursor:default}
.adyen-checkout__fieldset--personalDetails .adyen-checkout__field--gender .adyen-checkout__radio_group{display:flex}.adyen-checkout__fieldset--personalDetails .adyen-checkout__radio_group{display:flex;margin:8px 0}.adyen-checkout__fieldset--personalDetails .adyen-checkout__radio_group__input-wrapper{margin-right:20px}.adyen-checkout__fieldset--personalDetails .adyen-checkout__radio_group__input-wrapper:last-child{margin:0}
.adyen-checkout__open-invoice .adyen-checkout__fieldset--billingAddress{padding-bottom:8px}.adyen-checkout__open-invoice .adyen-checkout__fieldset--deliveryAddress{margin-top:24px;padding-bottom:8px}.adyen-checkout__open-invoice .adyen-checkout__input--separateDeliveryAddress{margin-bottom:0}.adyen-checkout__open-invoice .adyen-checkout__field--consentCheckbox{margin-top:22px}.adyen-checkout__input--separateDeliveryAddress+.adyen-checkout__checkbox__label{margin-top:16px}
.adyen-checkout__amazonpay__button{margin:auto}.adyen-checkout__amazonpay .adyen-checkout__button--ghost{display:block;margin:8px auto 0;width:auto}
@supports (-webkit-appearance:-apple-pay-button){.ApplePayButton-module_apple-pay-button__26P3-{-webkit-appearance:-apple-pay-button;cursor:pointer;display:inline-block}.ApplePayButton-module_apple-pay-button-black__3Ml54{-apple-pay-button-style:black}.ApplePayButton-module_apple-pay-button-white__1qE8A{-apple-pay-button-style:white}.ApplePayButton-module_apple-pay-button-white-with-line__j9FE5{-apple-pay-button-style:white-outline}.ApplePayButton-module_apple-pay-button--type-plain__2mnnX{-apple-pay-button-type:plain}.ApplePayButton-module_apple-pay-button--type-buy__eMnIy{-apple-pay-button-type:buy}.ApplePayButton-module_apple-pay-button--type-donate__3zvI8{-apple-pay-button-type:donate}.ApplePayButton-module_apple-pay-button--type-check-out__ipg0J{-apple-pay-button-type:check-out}.ApplePayButton-module_apple-pay-button--type-book__155Xs{-apple-pay-button-type:book}.ApplePayButton-module_apple-pay-button--type-subscribe__3uPJ5{-apple-pay-button-type:subscribe}.ApplePayButton-module_apple-pay-button--type-add-money__xmCaj{-apple-pay-button-type:add-money}.ApplePayButton-module_apple-pay-button--type-contribute__RCq2P{-apple-pay-button-type:contribute}.ApplePayButton-module_apple-pay-button--type-order__f5tpZ{-apple-pay-button-type:order}.ApplePayButton-module_apple-pay-button--type-reload__1P53C{-apple-pay-button-type:reload}.ApplePayButton-module_apple-pay-button--type-rent__2J4wk{-apple-pay-button-type:rent}.ApplePayButton-module_apple-pay-button--type-support__3-p0R{-apple-pay-button-type:support}.ApplePayButton-module_apple-pay-button--type-tip__2-gCt{-apple-pay-button-type:tip}.ApplePayButton-module_apple-pay-button--type-top-up__9UKXI{-apple-pay-button-type:top-up}}@supports not (-webkit-appearance:-apple-pay-button){.ApplePayButton-module_apple-pay-button__26P3-{background-position:50% 50%;background-repeat:no-repeat;background-size:100% 60%;border-radius:5px;box-sizing:border-box;display:inline-block;max-height:64px;min-height:32px;min-width:200px;padding:0}.ApplePayButton-module_apple-pay-button-black__3Ml54{background-color:black;background-image:-webkit-named-image(apple-pay-logo-white)}.ApplePayButton-module_apple-pay-button-white-with-line__j9FE5,.ApplePayButton-module_apple-pay-button-white__1qE8A{background-color:white;background-image:-webkit-named-image(apple-pay-logo-black)}.ApplePayButton-module_apple-pay-button-white-with-line__j9FE5{border:.5px solid black}}
.adyen-checkout__applepay__button{height:40px;width:240px}.adyen-checkout__dropin .adyen-checkout__applepay__button{width:100%}
.adyen-checkout__field--issuer-list{margin-bottom:0}
.CardInput-module_card-input__wrapper__2tAzu{position:relative}.CardInput-module_card-input__wrapper__2tAzu *,.CardInput-module_card-input__wrapper__2tAzu :after,.CardInput-module_card-input__wrapper__2tAzu :before{box-sizing:border-box}.CardInput-module_card-input__icon__2Iaf5{border-radius:3px;height:18px;margin-left:7px;position:absolute;right:10px;top:50%;transform:translateY(-50%);width:27px}.CardInput-module_card-input__form__2Ij_n{opacity:1}.CardInput-module_card-input__spinner__1wHzq{display:none;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.CardInput-module_card-input__spinner--active__1Dzoe{display:block}.CardInput-module_card-input__form--loading__3zh3Y{opacity:0}.CardInput-module_adyen-checkout__input__3Jmld{display:block;max-height:100px}.CardInput-module_adyen-checkout__card__cvc__input--hidden__1Z1lp,.CardInput-module_adyen-checkout__card__exp-date__input--hidden__3850Y{display:none}.CardInput-module_adyen-checkout__card__exp-cvc__exp-date__input--hidden__3wxr3{justify-content:flex-end}.CardInput-module_revolving-plan-installments__disabled__2yP53{opacity:.4;pointer-events:none}
.adyen-checkout__card-input__form{transition:opacity .25s ease-out}.adyen-checkout__card__cardNumber{max-width:400px}.adyen-checkout__card__cardNumber__input{padding:5px 8px}.adyen-checkout__card__exp-date__input--oneclick{font-weight:400;line-height:30px;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.adyen-checkout__card__holderName,.adyen-checkout__field--expiryDate,.adyen-checkout__field--storedCard{margin-bottom:0}.adyen-checkout__card-input .adyen-checkout__fieldset--billingAddress,.adyen-checkout__card__holderName,.adyen-checkout__card__kcp-authentication,.adyen-checkout__card__socialSecurityNumber,.adyen-checkout__installments,.adyen-checkout__store-details{margin-top:16px}.adyen-checkout__card__holderName:first-child{margin:0 0 16px}.adyen-checkout__field--cardNumber .adyen-checkout__input--error .adyen-checkout__card__cardNumber__brandIcon,.adyen-checkout__field--cardNumber
.adyen-checkout__input--valid:not(.adyen-checkout__card__cardNumber__input--noBrand)+.adyen-checkout-input__inline-validation--valid{display:none}.adyen-checkout__field--securityCode.adyen-checkout__field--error .adyen-checkout__card__cvc__hint,.adyen-checkout__field--securityCode.adyen-checkout__field--valid .adyen-checkout__card__cvc__hint{opacity:0}@-webkit-keyframes cvcIndicateLocation{0%{opacity:1}to{opacity:.3}}@keyframes cvcIndicateLocation{0%{opacity:1}to{opacity:.3}}.adyen-checkout__label--focused .adyen-checkout__field__cvc--back-hint .adyen-checkout__card__cvc__hint--back .adyen-checkout__card__cvc__hint__location,.adyen-checkout__label--focused .adyen-checkout__field__cvc--front-hint .adyen-checkout__card__cvc__hint--front .adyen-checkout__card__cvc__hint__location{-webkit-animation-direction:alternate;animation-direction:alternate;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:cvcIndicateLocation;animation-name:cvcIndicateLocation}.adyen-checkout__card__cvc__hint__wrapper{align-items:center;-webkit-backface-visibility:visible;backface-visibility:visible;display:flex;height:100%;margin:0 10px;position:absolute;right:0;top:0;transform:translateZ(0);transform-origin:center;transform-style:preserve-3d;transition:transform .3s cubic-bezier(.455,.03,.515,.955);width:27px;will-change:transform}.adyen-checkout__field__cvc--front-hint.adyen-checkout__card__cvc__hint__wrapper{transform:rotateY(180deg)}.adyen-checkout__card__cvc__hint{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute;transition:opacity .1s linear}.adyen-checkout__card__cvc__hint--front{transform:rotateY(180deg)}@media (prefers-reduced-motion:reduce){.adyen-checkout__card__cvc__hint__wrapper{transition:none}}.adyen-checkout__fieldset--revolving-plan .adyen-checkout__fieldset__fields{justify-content:left}.adyen-checkout__fieldset--revolving-plan .adyen-checkout__radio_group{display:flex;flex-direction:column}.adyen-checkout__fieldset--revolving-plan .adyen-checkout__radio_group__input-wrapper{margin-top:20px}.adyen-checkout__fieldset--revolving-plan .adyen-checkout__field--revolving-plan-installments{margin-left:15px;position:relative;top:42px;width:30%}
.LoadingWrapper-module_loading-input__form__1jpVs{opacity:1}.LoadingWrapper-module_loading-input__form--loading__3LDWz{opacity:0}.LoadingWrapper-module_loading-input__spinner__3eCyK{display:none;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.LoadingWrapper-module_loading-input__spinner--active__3UDtX{display:block}
.adyen-checkout__card__dual-branding__buttons{display:flex;opacity:.4;pointer-events:none}.adyen-checkout__card__dual-branding__buttons--active{opacity:1;pointer-events:auto}.adyen-checkout__card__dual-branding__buttons .adyen-checkout__card__cardNumber__brandIcon{cursor:pointer;opacity:1}.adyen-checkout__card__dual-branding__buttons .adyen-checkout__card__cardNumber__brandIcon:first-child{right:40px}.adyen-checkout__card__dual-branding__buttons .adyen-checkout__card__cardNumber__brandIcon--not-selected{opacity:.5}
.adyen-checkout__button-group{background:transparent;display:flex;justify-content:space-between}.adyen-checkout__button-group .adyen-checkout__button{background:transparent;border:0;box-shadow:inset 0 0 0 1px #99a3ad;color:#00112c;font-size:.81em;font-weight:400;height:40px;line-height:40px;margin-right:8px;padding:0;text-align:center}.adyen-checkout__button-group .adyen-checkout__button:last-child{margin-right:0}.adyen-checkout__button-group .adyen-checkout__button:hover{background:transparent;box-shadow:inset 0 0 0 2px #99a3ad}.adyen-checkout__button-group .adyen-checkout__button:active{background:#f7f8f9;box-shadow:inset 0 0 0 2px #99a3ad}.adyen-checkout__button-group .adyen-checkout__button--disabled,.adyen-checkout__button-group .adyen-checkout__button--disabled:hover{cursor:not-allowed;opacity:.4;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adyen-checkout__button-group .adyen-checkout__button--selected,.adyen-checkout__button-group .adyen-checkout__button--selected:active,.adyen-checkout__button-group .adyen-checkout__button--selected:active:hover,.adyen-checkout__button-group .adyen-checkout__button--selected:hover{background:#e5efff;box-shadow:inset 0 0 0 2px #06f;color:#06f;font-weight:500;height:40px;transition:none}.adyen-checkout__button-group .adyen-checkout__button .adyen-checkout__button-group__input{opacity:0;pointer-events:none;position:absolute}
.adyen-checkout__adyen-giving .adyen-checkout__status__icon{display:block;margin:56px auto 32px}.adyen-checkout__adyen-giving .adyen-checkout__status__text{color:#00112c;margin-bottom:56px;text-align:center}.adyen-checkout__campaign{background:#00112c;border-radius:6px;height:227px;overflow:hidden;position:relative}.adyen-checkout__campaign-link:hover .adyen-checkout__campaign-description{text-decoration:underline}.adyen-checkout__campaign-container{height:100%}.adyen-checkout__campaign-logo{border:2px solid rgba(255,255,255,.4);border-radius:3px;display:block;height:48px;margin-bottom:16px;overflow:hidden;width:48px}.adyen-checkout__campaign-background-image{background-color:#00112c;background-position:50%;background-size:cover;height:100%}.adyen-checkout__campaign-link .adyen-checkout__campaign-background-image:before{background:inherit;content:"";height:100%;position:absolute;transition:transform .6s ease-out;width:100%}.adyen-checkout__campaign-link .adyen-checkout__campaign-background-image:hover:before{transform:scale(1.1)}.adyen-checkout__campaign-link .adyen-checkout__campaign-content{pointer-events:none}.adyen-checkout__campaign-content{bottom:0;padding:16px;position:absolute;z-index:2}.adyen-checkout__campaign-description,.adyen-checkout__campaign-title{color:#fff;font-weight:400;margin:0}.adyen-checkout__campaign-title{font-size:1em;margin-bottom:8px}.adyen-checkout__campaign-description{font-size:.81em;line-height:19px}.adyen-checkout__adyen-giving-actions{margin-top:16px}.adyen-checkout__button.adyen-checkout__button--donate{margin:16px auto 8px}.adyen-checkout__button.adyen-checkout__button--decline{display:block;margin:auto;width:auto}
.adyen-checkout__paywithgoogle>div>button,.adyen-checkout__paywithgoogle>div>button.long,.adyen-checkout__paywithgoogle>div>button.short{height:48px;transition:background-color .3s ease-out,box-shadow .3s ease-out}.adyen-checkout__paywithgoogle>div>button.long:focus,.adyen-checkout__paywithgoogle>div>button.short:focus,.adyen-checkout__paywithgoogle>div>button:focus{box-shadow:0 0 0 2px #99c2ff;outline:0}.adyen-checkout__paywithgoogle>div>button.gpay-button{padding:15px 24px 13px}
.adyen-checkout__voucher-result{border-radius:12px;box-sizing:border-box;position:relative;text-align:center}.adyen-checkout__voucher-result__bottom,.adyen-checkout__voucher-result__top{background:#fff;border:1px solid #d4d9db}.adyen-checkout__voucher-result__top{border-bottom:0;border-radius:12px 12px 0 0;padding:40px 0 24px}.adyen-checkout__voucher-result__bottom{border-radius:0 0 12px 12px;border-top:0}.adyen-checkout__voucher-result__separator{align-items:center;background:#fff;display:flex;height:13px;margin:0 auto;position:relative;width:calc(100% - 14px)}.adyen-checkout__voucher-result__separator:after,.adyen-checkout__voucher-result__separator:before{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNyIgaGVpZ2h0PSIxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjYSkiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMCAwIDUgMiAxLjUgNEg3VjBIMHptMCAxMyA1LTIgMS41LTRIN3Y2SDB6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTYuNDIzIDYuNUM2LjQyMyAzLjMxMiAzLjc4My43NTYuNS41MThjMy4zODYuMjM2IDYgMi44NTUgNiA1Ljk4MiAwIDMuMTI3LTIuNjE0IDUuNzQ2LTYgNS45ODN2LS4wMDFjMy4yODQtLjIzNyA1LjkyMy0yLjc5NCA1LjkyMy01Ljk4MnoiIHN0cm9rZT0iI0Q0RDlEQiIvPjxwYXRoIGZpbGw9IiNENEQ5REIiIGQ9Ik0wIDBoMXYxSDB6TTAgMTJoMXYxSDB6Ii8+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0iYSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTAgMGg3djEzSDB6Ii8+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+)}.adyen-checkout__voucher-result__separator:before{left:-7px}.adyen-checkout__voucher-result__separator:after,.adyen-checkout__voucher-result__separator:before{background-position:100%;background-repeat:no-repeat;content:"";height:13px;position:absolute;top:0;width:7px}.adyen-checkout__voucher-result__separator:after{right:-7px;transform:rotate(-180deg)}.adyen-checkout__voucher-result__separator__inner{border-top:1px solid #e6e9eb;width:100%}.adyen-checkout__voucher-result__image{align-items:center;display:flex;justify-content:center;margin-bottom:40px;width:100%}.adyen-checkout__link--voucher-result-instructions{display:inline-block}.adyen-checkout__voucher-result__image__wrapper{display:block;height:48px;margin:0 24px;position:relative}.adyen-checkout__voucher-result__image__wrapper:after{border:1px solid rgba(0,27,43,.17);border-radius:3px;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.adyen-checkout__voucher-result__image__wrapper:nth-child(2):before{border-left:1px solid #d4d9db;content:"";height:64px;left:-24.5px;position:absolute;top:-8px;width:1px}.adyen-checkout__voucher-result__image__brand,.adyen-checkout__voucher-result__image__issuer{border-radius:3px;height:48px}.adyen-checkout__voucher-result__introduction{color:#00112c;font-size:.81em;line-height:19px;margin:0 auto;max-width:400px;text-align:center}.adyen-checkout__voucher-result__amount{color:#00112c;font-size:1em;font-weight:700;margin:24px auto 0;text-align:center}.adyen-checkout__voucher-result__surcharge{color:#687282;display:block;font-size:.81em;font-weight:400;line-height:19px;text-align:center}.adyen-checkout__voucher-result__code__label{display:block;font-weight:400;left:0;line-height:19px;margin:0 auto;position:absolute;right:0;top:-2px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:auto}.adyen-checkout__voucher-result__code__label:before{content:"";position:absolute}.adyen-checkout__voucher-result__code__label__text{background:#fff;color:#00112c;font-size:13px;letter-spacing:normal;line-height:1;padding:0 8px}.adyen-checkout__voucher-result__code__barcode{display:block;height:56px;margin:0 auto 8px;max-width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adyen-checkout__voucher-result__code{border-width:1px 0;color:#00112c;display:inline-block;font-size:1.5em;font-weight:700;letter-spacing:1px;line-height:1.2;margin:0 auto;padding:16px 48px;position:relative;text-align:center;-webkit-user-select:all;-moz-user-select:all;user-select:all;width:100%;word-break:break-word}.adyen-checkout__voucher-result__details{list-style:none;margin:-1px auto 0;padding:0}.adyen-checkout__voucher-result__details__item{border-top:1px solid #e6e9eb;color:#00112c;display:flex;font-size:.81em;justify-content:space-between;padding:16px 24px;word-break:break-word}.adyen-checkout__voucher-result__details__item:last-child{margin-bottom:0}.adyen-checkout__voucher-result__details__label{max-width:50%;text-align:left}.adyen-checkout__voucher-result__details__value{font-weight:700;max-width:50%;text-align:right}.adyen-checkout__voucher-result__actions{align-items:center;display:flex;justify-content:center;list-style:none;margin:0 auto 32px;max-width:100%;min-width:200px;padding:0;width:300px}.adyen-checkout__voucher-result__actions__item{margin:0 4px}
.adyen-checkout__paypal__buttons{position:relative;z-index:0}.adyen-checkout__paypal__button{display:flex;margin-bottom:16px}.adyen-checkout__paypal__button:empty{display:none}.adyen-checkout__paypal__status--pending{margin:16px 0}.adyen-checkout__paypal__status--processing{align-items:center;display:flex;font-size:13px;justify-content:center;padding:24px 0}.adyen-checkout__payment-method .adyen-checkout__paypal__status--pending{margin:-16px 0 38px}.adyen-checkout__payment-method .adyen-checkout__paypal__status--processing{padding:20px 0 65px}
.adyen-checkout__phone-input{direction:ltr}.adyen-checkout__phone-input .adyen-checkout__input-wrapper{width:100%}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__input{height:auto;padding:0}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__input:focus{border:1px solid #06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__dropdown__button{border:0;border-bottom-right-radius:0;border-top-right-radius:0;height:35px;width:auto}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__dropdown__button:after{box-sizing:revert;height:10px;left:40px}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__input--phoneNumber{border:1px solid transparent;height:35px;margin-left:8px;padding-left:15px}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__input-wrapper--phoneInput{align-items:center;display:flex}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__input-wrapper--phoneInput:focus{border:1px solid #06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__phoneNumber{align-items:center;display:flex;margin-left:65px;width:100%}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__countryFlag{position:absolute}.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__dropdown__button--active,.adyen-checkout__phone-input .adyen-checkout__input-wrapper .adyen-checkout__dropdown__button--active:hover{box-shadow:none}
.adyen-checkout__iban-input__number{padding:5px 36px 5px 8px;text-transform:uppercase}
.adyen-checkout__threeds2__challenge,.adyen-checkout__threeds2__challenge-container{background-color:transparent;box-sizing:border-box;display:block;height:inherit;min-height:400px;overflow:hidden;position:relative;width:100%}.adyen-checkout__threeds2__challenge--01,.adyen-checkout__threeds2__challenge--01 .adyen-checkout__iframe--threeDSIframe{height:400px;width:250px}.adyen-checkout__threeds2__challenge--02,.adyen-checkout__threeds2__challenge--02 .adyen-checkout__iframe--threeDSIframe{height:400px;width:390px}.adyen-checkout__threeds2__challenge--03,.adyen-checkout__threeds2__challenge--03 .adyen-checkout__iframe--threeDSIframe{height:600px;width:500px}.adyen-checkout__threeds2__challenge--04,.adyen-checkout__threeds2__challenge--04 .adyen-checkout__iframe--threeDSIframe{height:400px;width:600px}.adyen-checkout__threeds2__challenge--05,.adyen-checkout__threeds2__challenge--05 .adyen-checkout__iframe--threeDSIframe{height:100%;width:100%}.adyen-checkout__iframe--threeDSIframe{border:0;left:0;position:absolute;top:0}
.adyen-checkout__qr-loader{background:#fff;border:1px solid #d4d9db;border-radius:12px;padding:40px;text-align:center}.adyen-checkout__qr-loader--result{padding:100px}.adyen-checkout__qr-loader--app{border:0;border-radius:0;padding:0}.adyen-checkout__qr-loader__brand-logo{border-radius:3px;width:74px}.adyen-checkout__qr-loader__subtitle{margin:32px auto 0;max-width:400px}.adyen-checkout__qr-loader__subtitle--result{margin-bottom:32px}.adyen-checkout__qr-loader__payment_amount,.adyen-checkout__qr-loader__subtitle{color:#00112c;font-size:1em;line-height:19px}.adyen-checkout__qr-loader__icon{height:88px;width:88px}.adyen-checkout__qr-loader__payment_amount{font-weight:700}.adyen-checkout__qr-loader__progress{background:#d4d9db;border-radius:24px;height:4px;margin:32px auto 12px;padding-right:3%;width:152px}[dir=rtl] .adyen-checkout__qr-loader__progress{padding-left:3%;padding-right:0}.adyen-checkout__qr-loader__percentage{background:#06f;border-radius:24px;display:block;height:100%}.adyen-checkout__qr-loader__countdown{color:#687282;font-size:.81em}.adyen-checkout__qr-loader>.adyen-checkout__spinner__wrapper{margin:60px 0}.adyen-checkout__qr-loader__app-link{display:none;margin-top:16px}.adyen-checkout__qr-loader__separator__label{color:#687282;display:block;font-size:13px;overflow:hidden;position:relative;text-align:center;z-index:1}.adyen-checkout__qr-loader__separator__label:after,.adyen-checkout__qr-loader__separator__label:before{background-color:#e6e9eb;content:"\a0";height:1px;overflow:hidden;position:absolute;top:51%;width:50%}.adyen-checkout__qr-loader__separator__label:before{margin-left:-52%;text-align:right}.adyen-checkout__qr-loader__separator__label:after{margin-left:2%}.adyen-checkout__button.adyen-checkout__button--qr-loader{margin-top:24px;text-decoration:none}.adyen-checkout__qr-loader__instructions{color:#687282;font-size:1em;line-height:1.5;margin-top:32px}.adyen-checkout__qr-loader__actions{align-items:center;display:flex;justify-content:center;margin-top:32px}@media only screen and (max-device-width:1200px){.adyen-checkout__qr-loader__app-link{display:block}}
.adyen-checkout__voucher-result--boletobancario .adyen-checkout__voucher-result__code{font-size:.81em;line-height:19px;padding:24px;word-break:break-all}
.adyen-checkout__voucher-result--oxxo .adyen-checkout__voucher-result__code{font-size:.81em;line-height:19px;padding:24px;word-break:break-all}
.adyen-checkout__alert-message{border-radius:6px;display:flex;font-size:.81em;margin:0 0 16px;padding:12px;text-align:left}.adyen-checkout__alert-message--error{background:#fbe6ed}.adyen-checkout__alert-message--warning{background:#ffeacc}.adyen-checkout__alert-message--info{background:#e5efff}.adyen-checkout__alert-message__icon{height:14px;margin-right:8px;width:14px}
.adyen-checkout__giftcard-result__header{align-items:center;display:flex;flex-wrap:nowrap;font-size:1em;font-weight:400;justify-content:space-between;position:relative;width:100%}.adyen-checkout__giftcard-result__header__title{align-items:center;display:flex}.adyen-checkout__giftcard-result__name{margin-left:8px}.adyen-checkout__giftcard-result__balance{list-style:none;margin:16px 0 0;padding:0}.adyen-checkout__giftcard-result__balance__item{display:flex;justify-content:space-between;margin-bottom:8px}.adyen-checkout__giftcard-result__balance__item .adyen-checkout__giftcard-result__balance__title--transactionLimit{color:#687282}.adyen-checkout__giftcard-result__balance__item:last-child{margin-bottom:0}.adyen-checkout__giftcard-result__balance__value--amount{font-weight:700}.adyen-checkout__giftcard-result__remaining-balance{color:#687282;font-size:13px;line-height:19px;margin:8px auto 0;text-align:center}
.DropinComponent-module_adyen-checkout__payment-methods-list__2T9kQ{list-style:none;margin:0;padding:0}.DropinComponent-module_adyen-checkout__payment-method__2ZClo{display:block;max-height:60px}.DropinComponent-module_adyen-checkout__payment-method__details__2_jFP{display:none}.DropinComponent-module_adyen-checkout__payment-method__image__Fg2uw{height:26px;width:40px}.DropinComponent-module_adyen-checkout__payment-method__image__wrapper__pTTKr{margin-right:8px}[dir=rtl] .DropinComponent-module_adyen-checkout__payment-method__image__wrapper__pTTKr{margin-left:8px;margin-right:0}.DropinComponent-module_adyen-checkout__payment-method--selected__1zXEA{max-height:100%}.DropinComponent-module_adyen-checkout__payment-method--selected__1zXEA .DropinComponent-module_adyen-checkout__payment-method__details__2_jFP{display:block}
.adyen-checkout__payment-method__disable-confirmation{background:#d10244;border-left:1px solid #c70241;border-right:1px solid #c70241;color:#fff;font-size:.81em;margin:0 -17px;max-height:0;opacity:0;overflow:hidden;transition:opacity .15s ease-out,max-height .15s linear,margin-bottom .1s linear}.adyen-checkout__payment-method__disable-confirmation.adyen-checkout__payment-method__disable-confirmation--open{margin-bottom:16px;max-height:62px;opacity:1}.adyen-checkout__payment-method__disable-confirmation__content{align-items:center;display:flex;justify-content:space-between;padding:8px 16px}.adyen-checkout__payment-method__disable-confirmation__buttons{display:flex}.adyen-checkout__payment-method__disable-confirmation__button{background:#d10244;border:1px solid transparent;border-radius:6px;color:#fff;cursor:pointer;display:block;height:auto;line-height:14px;margin:0 0 0 8px;padding:8px;width:auto}.adyen-checkout__payment-method__disable-confirmation__button:hover,.adyen-checkout__payment-method__disable-confirmation__button:hover:focus{background:#b8023c;box-shadow:none}.adyen-checkout__payment-method__disable-confirmation__button:active,.adyen-checkout__payment-method__disable-confirmation__button:hover:active{background:#9e0234;box-shadow:none}.adyen-checkout__payment-method__disable-confirmation__button--remove,.adyen-checkout__payment-method__disable-confirmation__button--remove:disabled{border-color:#fff}.adyen-checkout__payment-method__disable-confirmation__button--cancel,.adyen-checkout__payment-method__disable-confirmation__button--cancel:disabled{border-color:transparent}
.adyen-checkout__payment-method{background:#fff;border:1px solid #e6e9eb;cursor:pointer;margin-top:-1px;position:relative;transition:opacity .3s ease-out;width:100%}.adyen-checkout__payment-method:focus{outline:0}.adyen-checkout__payment-method--selected+.adyen-checkout__payment-method,.adyen-checkout__payment-method:first-child{border-top-left-radius:12px;border-top-right-radius:12px;margin-top:0}.adyen-checkout__payment-method--next-selected,.adyen-checkout__payment-method:last-child{border-bottom-left-radius:12px;border-bottom-right-radius:12px;margin-bottom:0}.adyen-checkout__payment-method--loading{opacity:.2}.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading{opacity:.9}.adyen-checkout__payment-method--confirming .adyen-checkout__payment-method__details__content,.adyen-checkout__payment-method--disabling{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adyen-checkout__payment-method--disabling{opacity:.3}.adyen-checkout__payment-method__header{align-items:center;color:#00112c;display:flex;flex-wrap:nowrap;font-size:1em;font-weight:400;justify-content:space-between;padding:16px 16px 16px 48px;position:relative;transition:background .1s ease-out;width:100%}[dir=rtl] .adyen-checkout__payment-method__header{padding:16px 48px 16px 16px}.adyen-checkout__payment-method--standalone .adyen-checkout__payment-method__header{padding:16px}.adyen-checkout__payment-method__header__title{align-items:center;background:none;border:none;color:#00112c;cursor:pointer;display:flex;flex-shrink:0;font-size:1em;font-weight:400;margin-right:16px;max-width:100%;padding:0}[dir=rtl] .adyen-checkout__payment-method__header__title{margin-left:16px;margin-right:0}.adyen-checkout__payment-method__surcharge{color:#687282;margin-left:5px}.adyen-checkout__payment-method--selected{background:#f7f8f9;border:1px solid #e6e9eb;border-radius:12px;cursor:default;margin:8px 0;transition:margin .15s cubic-bezier(.4,0,.2,1) 0ms,opacity .3s ease-out}.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__header{flex-wrap:wrap}.adyen-checkout__payment-method__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.adyen-checkout__payment-method__name--selected{font-weight:500}.adyen-checkout__payment-method__details{padding:0 16px;position:relative}.adyen-checkout__payment-method__details__content{margin:0 0 16px}.adyen-checkout__payment-method__image__wrapper{height:26px;position:relative;width:40px}.adyen-checkout__payment-method__image__wrapper--outline:after{border:1px solid rgba(0,27,43,.17);border-radius:3px;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.adyen-checkout__payment-method__image{border-radius:3px;display:block}.adyen-checkout__payment-method__brands{display:flex;flex-basis:auto;flex-shrink:1;flex-wrap:wrap;height:16px;margin:4px 0;overflow:hidden;text-align:right}.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__brands{height:auto;overflow:visible;text-align:left}.adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper{display:inline-block;height:16px;margin-right:4px;transition:opacity .2s ease-out;width:24px}.adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper:last-child{margin:0}.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper{margin-bottom:4px}.adyen-checkout__payment-method__brands img{height:16px;width:24px}.adyen-checkout__payment-method__image__wrapper--disabled{opacity:.25}.adyen-checkout__payment-method__radio{background-color:#fff;border:1px solid #b9c4c9;border-radius:50%;height:16px;left:16px;position:absolute;transition:border-color .2s ease-out,box-shadow .2s ease-out;width:16px}[dir=rtl] .adyen-checkout__payment-method__radio{left:auto;right:16px}.adyen-checkout__payment-method--standalone .adyen-checkout__payment-method__radio{display:none}.adyen-checkout__payment-method__radio:after{background-color:#fff;border-radius:50%;content:"";display:block;height:6px;left:0;margin:0 auto;position:absolute;right:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease-out;width:6px}.adyen-checkout__payment-method:hover:not(.adyen-checkout__payment-method--selected) .adyen-checkout__payment-method__radio{border-color:#99a3ad;box-shadow:0 0 0 2px #d4d9db;cursor:pointer}.adyen-checkout__payment-method__radio--selected{background-color:#06f;border:0;transition:all .3s ease-out}.adyen-checkout__payment-method__radio--selected:hover{box-shadow:0 0 0 2px rgba(0,102,255,.4)}.adyen-checkout__payment-method__radio--selected:after{transform:translateY(-50%) scale(1)}
.adyen-checkout__order-payment-methods-list{list-style:none;margin:0 auto 16px;padding:0}.adyen-checkout__order-payment-method{background:#fff;border:1px solid #e6e9eb;margin-top:-1px;position:relative;width:100%}.adyen-checkout__order-payment-method:first-child{border-top-left-radius:12px;border-top-right-radius:12px}.adyen-checkout__order-payment-method:last-child{border-bottom-left-radius:12px;border-bottom-right-radius:12px}.adyen-checkout__order-payment-method__header{align-items:center;color:#00112c;display:flex;flex-wrap:nowrap;font-size:1em;font-weight:500;justify-content:space-between;padding:16px;position:relative;transition:background .1s ease-out;width:100%}.adyen-checkout__order-payment-method__details{padding:0 16px 16px}.adyen-checkout__order-payment-method__deducted-amount{display:flex;font-size:1em;justify-content:space-between;line-height:1em}.adyen-checkout__order-payment-method__deducted-amount__label{font-size:.81em}.adyen-checkout__order-payment-method__deducted-amount__value{font-weight:500}.adyen-checkout__order-remaining-amount{background:#ffeacc;border-radius:6px;color:#7f4a00;display:block;font-size:.81em;margin-bottom:16px;padding:8px 16px;width:100%}.adyen-checkout__order-remaining-amount strong{font-weight:700}
.adyen-checkout__status{align-items:center;background-color:#fff;border:1px solid #d4d9db;border-radius:6px;color:#00112c;display:flex;flex-direction:column;font-size:1em;height:350px;justify-content:center;margin:0;padding:32px;text-align:center}.adyen-checkout__status__icon{margin-bottom:24px}.adyen-checkout__status .adyen-checkout__spinner__wrapper{max-height:88px}
.adyen-checkout__dropin,.adyen-checkout__dropin *,.adyen-checkout__dropin :after,.adyen-checkout__dropin :before{box-sizing:border-box}.adyen-checkout__payment-methods-list--loading{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.adyen-checkout__link{color:#06f;text-decoration:none}.adyen-checkout__link:hover{text-decoration:underline}
.AchInput-module_sf-input__wrapper__1V7mk{position:relative}.AchInput-module_sf-input__wrapper__1V7mk *,.AchInput-module_sf-input__wrapper__1V7mk :after,.AchInput-module_sf-input__wrapper__1V7mk :before{box-sizing:border-box}.AchInput-module_adyen-checkout__input__1SeSl{display:block;max-height:100px}
.adyen-checkout__loading-input__form{transition:opacity .25s ease-out}.adyen-checkout__pm__holderName{margin-bottom:0}.adyen-checkout__fieldset__title+.adyen-checkout__ach-sf__form{margin-top:0}.adyen-checkout__ach-input .adyen-checkout__fieldset--address,.adyen-checkout__ach-sf__form{margin-top:16px}
.adyen-checkout__loading-input__form{transition:opacity .25s ease-out}
.adyen-checkout__await{background:#fff;border:1px solid #d4d9db;border-radius:12px;padding:40px;text-align:center}.adyen-checkout__await--result{padding:100px}.adyen-checkout__qr-loader--app{border:0;border-radius:0;padding:0}.adyen-checkout__await__brand-logo{border-radius:3px;width:74px}.adyen-checkout__await__indicator-text,.adyen-checkout__await__subtitle{color:#00112c;font-size:1em;line-height:19px;margin-top:32px}.adyen-checkout__await__indicator-holder .adyen-checkout__await__indicator-text{margin-left:10px;margin-top:6px}.adyen-checkout__await__indicator-holder{display:flex;justify-content:center;margin-bottom:20px;margin-top:32px}.adyen-checkout__await__subtitle--result{margin-bottom:32px}.adyen-checkout__await__icon{height:88px;width:88px}.adyen-checkout__await__progress{background:#d4d9db;border-radius:24px;height:4px;margin:32px auto 12px;width:152px}.adyen-checkout__await__percentage{background:#06f;border-radius:24px;display:block;height:100%}.adyen-checkout__await__countdown{color:#687282;font-size:.81em}.adyen-checkout__await>.adyen-checkout__spinner__wrapper{margin:60px 0}.adyen-checkout__await__app-link{display:none;margin-top:16px}.adyen-checkout__await__separator__label{color:#687282;display:block;font-size:13px;overflow:hidden;position:relative;text-align:center;z-index:1}.adyen-checkout__await__separator__label:after,.adyen-checkout__await__separator__label:before{background-color:#e6e9eb;content:"\a0";height:1px;overflow:hidden;position:absolute;top:51%;width:50%}.adyen-checkout__await__separator__label:before{margin-left:-52%;text-align:right}.adyen-checkout__await__separator__label:after{margin-left:2%}@media only screen and (max-device-width:1200px){.adyen-checkout__await__app-link{display:block}}
.adyen-checkout__blik__helper{color:#00112c;font-size:1em;font-weight:400;margin:0 0 16px;padding:0}
.adyen-checkout__bankTransfer__introduction{color:#00112c;font-size:.81em;font-weight:400;margin:0 0 16px;padding:0}.adyen-checkout__bankTransfer__emailField{margin:0 0 16px}
.adyen-checkout__bacs--confirm{position:relative}.adyen-checkout__bacs--confirm .adyen-checkout-input__inline-validation--valid{display:none}.adyen-checkout__bacs .adyen-checkout__field--inactive{pointer-events:none}.adyen-checkout__bacs .adyen-checkout__bacs--edit{cursor:pointer;position:absolute;right:0;top:-25px;width:20%}.adyen-checkout__bacs .adyen-checkout__bacs--edit-dropin{top:-50px}.adyen-checkout__bacs .adyen-checkout__bacs--edit .adyen-checkout__bacs--edit-button{background:none;border:none;color:#06f;cursor:pointer;text-align:end;text-decoration:underline}
.adyen-checkout__voucher-result__introduction{font-size:1em;max-width:420px}
.adyen-checkout__klarna-widget{pointer-events:all}
/*# sourceMappingURL=adyen.css.map */html {
  font-size: var(--agFontSizeMd);
  font-family: var(--agFontFamily);
  line-height: normal;
}

/*!
* animate.css - https://animate.style/
* Version - 4.1.1
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2020 Animate.css
*/
:root {
  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1;
}

.animate__animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-duration: var(--animate-duration);
  animation-duration: var(--animate-duration);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animate__animated.animate__infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animate__animated.animate__repeat-1 {
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: var(--animate-repeat);
  animation-iteration-count: var(--animate-repeat);
}

.animate__animated.animate__repeat-2 {
  -webkit-animation-iteration-count: 2;
  animation-iteration-count: 2;
  -webkit-animation-iteration-count: calc(var(--animate-repeat) * 2);
  animation-iteration-count: calc(var(--animate-repeat) * 2);
}

.animate__animated.animate__repeat-3 {
  -webkit-animation-iteration-count: 3;
  animation-iteration-count: 3;
  -webkit-animation-iteration-count: calc(var(--animate-repeat) * 3);
  animation-iteration-count: calc(var(--animate-repeat) * 3);
}

.animate__animated.animate__delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-delay: var(--animate-delay);
  animation-delay: var(--animate-delay);
}

.animate__animated.animate__delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
  -webkit-animation-delay: calc(var(--animate-delay) * 2);
  animation-delay: calc(var(--animate-delay) * 2);
}

.animate__animated.animate__delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
  -webkit-animation-delay: calc(var(--animate-delay) * 3);
  animation-delay: calc(var(--animate-delay) * 3);
}

.animate__animated.animate__delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
  -webkit-animation-delay: calc(var(--animate-delay) * 4);
  animation-delay: calc(var(--animate-delay) * 4);
}

.animate__animated.animate__delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
  -webkit-animation-delay: calc(var(--animate-delay) * 5);
  animation-delay: calc(var(--animate-delay) * 5);
}

.animate__animated.animate__faster {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-duration: calc(var(--animate-duration) / 2);
  animation-duration: calc(var(--animate-duration) / 2);
}

.animate__animated.animate__fast {
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-duration: calc(var(--animate-duration) * 0.8);
  animation-duration: calc(var(--animate-duration) * 0.8);
}

.animate__animated.animate__slow {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-duration: calc(var(--animate-duration) * 2);
  animation-duration: calc(var(--animate-duration) * 2);
}

.animate__animated.animate__slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-duration: calc(var(--animate-duration) * 3);
  animation-duration: calc(var(--animate-duration) * 3);
}

@media print, (prefers-reduced-motion: reduce) {
  .animate__animated {
    -webkit-animation-duration: 1ms !important;
    animation-duration: 1ms !important;
    -webkit-transition-duration: 1ms !important;
    transition-duration: 1ms !important;
    -webkit-animation-iteration-count: 1 !important;
    animation-iteration-count: 1 !important;
  }
  .animate__animated[class*=Out] {
    opacity: 0;
  }
}
/* Attention seekers  */
@-webkit-keyframes bounce {
  from, 20%, 53%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);
    transform: translate3d(0, -30px, 0) scaleY(1.1);
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);
    transform: translate3d(0, -15px, 0) scaleY(1.05);
  }
  80% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0) scaleY(0.95);
    transform: translate3d(0, 0, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
    transform: translate3d(0, -4px, 0) scaleY(1.02);
  }
}
@keyframes bounce {
  from, 20%, 53%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);
    transform: translate3d(0, -30px, 0) scaleY(1.1);
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);
    transform: translate3d(0, -15px, 0) scaleY(1.05);
  }
  80% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0) scaleY(0.95);
    transform: translate3d(0, 0, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
    transform: translate3d(0, -4px, 0) scaleY(1.02);
  }
}
.animate__bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}
@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}
.animate__flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shakeX {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
@keyframes shakeX {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
.animate__shakeX {
  -webkit-animation-name: shakeX;
  animation-name: shakeX;
}

@-webkit-keyframes shakeY {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
@keyframes shakeY {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
.animate__shakeY {
  -webkit-animation-name: shakeY;
  animation-name: shakeY;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }
  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }
  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }
  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }
  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }
  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }
  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.animate__headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
.animate__swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  10%, 20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  10%, 20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }
  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
@keyframes jello {
  from, 11.1%, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }
  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
.animate__jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.animate__heartBeat {
  -webkit-animation-name: heartBeat;
  animation-name: heartBeat;
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-duration: calc(var(--animate-duration) * 1.3);
  animation-duration: calc(var(--animate-duration) * 1.3);
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

/* Back entrances */
@-webkit-keyframes backInDown {
  0% {
    -webkit-transform: translateY(-1200px) scale(0.7);
    transform: translateY(-1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInDown {
  0% {
    -webkit-transform: translateY(-1200px) scale(0.7);
    transform: translateY(-1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInDown {
  -webkit-animation-name: backInDown;
  animation-name: backInDown;
}

@-webkit-keyframes backInLeft {
  0% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInLeft {
  0% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInLeft {
  -webkit-animation-name: backInLeft;
  animation-name: backInLeft;
}

@-webkit-keyframes backInRight {
  0% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInRight {
  0% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInRight {
  -webkit-animation-name: backInRight;
  animation-name: backInRight;
}

@-webkit-keyframes backInUp {
  0% {
    -webkit-transform: translateY(1200px) scale(0.7);
    transform: translateY(1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInUp {
  0% {
    -webkit-transform: translateY(1200px) scale(0.7);
    transform: translateY(1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInUp {
  -webkit-animation-name: backInUp;
  animation-name: backInUp;
}

/* Back exits */
@-webkit-keyframes backOutDown {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(700px) scale(0.7);
    transform: translateY(700px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutDown {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(700px) scale(0.7);
    transform: translateY(700px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutDown {
  -webkit-animation-name: backOutDown;
  animation-name: backOutDown;
}

@-webkit-keyframes backOutLeft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutLeft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutLeft {
  -webkit-animation-name: backOutLeft;
  animation-name: backOutLeft;
}

@-webkit-keyframes backOutRight {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutRight {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutRight {
  -webkit-animation-name: backOutRight;
  animation-name: backOutRight;
}

@-webkit-keyframes backOutUp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(-700px) scale(0.7);
    transform: translateY(-700px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutUp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(-700px) scale(0.7);
    transform: translateY(-700px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutUp {
  -webkit-animation-name: backOutUp;
  animation-name: backOutUp;
}

/* Bouncing entrances  */
@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0) scaleY(3);
    transform: translate3d(0, -3000px, 0) scaleY(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);
    transform: translate3d(0, 25px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);
    transform: translate3d(0, -10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);
    transform: translate3d(0, 5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0) scaleY(3);
    transform: translate3d(0, -3000px, 0) scaleY(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);
    transform: translate3d(0, 25px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);
    transform: translate3d(0, -10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);
    transform: translate3d(0, 5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0) scaleX(3);
    transform: translate3d(3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
    transform: translate3d(-25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
    transform: translate3d(10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
    transform: translate3d(-5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0) scaleX(3);
    transform: translate3d(3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
    transform: translate3d(-25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
    transform: translate3d(10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
    transform: translate3d(-5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0) scaleY(5);
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0) scaleY(5);
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

/* Bouncing exits  */
@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
.animate__bounceOut {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.985);
    transform: translate3d(0, 10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0) scaleY(3);
    transform: translate3d(0, 2000px, 0) scaleY(3);
  }
}
@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.985);
    transform: translate3d(0, 10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0) scaleY(3);
    transform: translate3d(0, 2000px, 0) scaleY(3);
  }
}
.animate__bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0) scaleX(0.9);
    transform: translate3d(20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2);
    transform: translate3d(-2000px, 0, 0) scaleX(2);
  }
}
@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0) scaleX(0.9);
    transform: translate3d(20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2);
    transform: translate3d(-2000px, 0, 0) scaleX(2);
  }
}
.animate__bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0) scaleX(0.9);
    transform: translate3d(-20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0) scaleX(2);
    transform: translate3d(2000px, 0, 0) scaleX(2);
  }
}
@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0) scaleX(0.9);
    transform: translate3d(-20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0) scaleX(2);
    transform: translate3d(2000px, 0, 0) scaleX(2);
  }
}
.animate__bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.985);
    transform: translate3d(0, -10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0) scaleY(0.9);
    transform: translate3d(0, 20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0) scaleY(3);
    transform: translate3d(0, -2000px, 0) scaleY(3);
  }
}
@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.985);
    transform: translate3d(0, -10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0) scaleY(0.9);
    transform: translate3d(0, 20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0) scaleY(3);
    transform: translate3d(0, -2000px, 0) scaleY(3);
  }
}
.animate__bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

/* Fading entrances  */
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.animate__fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeInTopLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInTopLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInTopLeft {
  -webkit-animation-name: fadeInTopLeft;
  animation-name: fadeInTopLeft;
}

@-webkit-keyframes fadeInTopRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInTopRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInTopRight {
  -webkit-animation-name: fadeInTopRight;
  animation-name: fadeInTopRight;
}

@-webkit-keyframes fadeInBottomLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInBottomLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInBottomLeft {
  -webkit-animation-name: fadeInBottomLeft;
  animation-name: fadeInBottomLeft;
}

@-webkit-keyframes fadeInBottomRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInBottomRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInBottomRight {
  -webkit-animation-name: fadeInBottomRight;
  animation-name: fadeInBottomRight;
}

/* Fading exits */
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.animate__fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.animate__fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
.animate__fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.animate__fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
.animate__fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.animate__fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
.animate__fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.animate__fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
.animate__fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
}
@keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
}
.animate__fadeOutTopLeft {
  -webkit-animation-name: fadeOutTopLeft;
  animation-name: fadeOutTopLeft;
}

@-webkit-keyframes fadeOutTopRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
}
@keyframes fadeOutTopRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
}
.animate__fadeOutTopRight {
  -webkit-animation-name: fadeOutTopRight;
  animation-name: fadeOutTopRight;
}

@-webkit-keyframes fadeOutBottomRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
}
@keyframes fadeOutBottomRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
}
.animate__fadeOutBottomRight {
  -webkit-animation-name: fadeOutBottomRight;
  animation-name: fadeOutBottomRight;
}

@-webkit-keyframes fadeOutBottomLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
}
@keyframes fadeOutBottomLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
}
.animate__fadeOutBottomLeft {
  -webkit-animation-name: fadeOutBottomLeft;
  animation-name: fadeOutBottomLeft;
}

/* Flippers */
@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
@keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
.animate__animated.animate__flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.animate__flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.animate__flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.animate__flipOutX {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
.animate__flipOutY {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

/* Lightspeed */
@-webkit-keyframes lightSpeedInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes lightSpeedInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__lightSpeedInRight {
  -webkit-animation-name: lightSpeedInRight;
  animation-name: lightSpeedInRight;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);
    transform: translate3d(-100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(5deg);
    transform: skewX(5deg);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes lightSpeedInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);
    transform: translate3d(-100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(5deg);
    transform: skewX(5deg);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__lightSpeedInLeft {
  -webkit-animation-name: lightSpeedInLeft;
  animation-name: lightSpeedInLeft;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOutRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOutRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
.animate__lightSpeedOutRight {
  -webkit-animation-name: lightSpeedOutRight;
  animation-name: lightSpeedOutRight;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes lightSpeedOutLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg);
    transform: translate3d(-100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOutLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg);
    transform: translate3d(-100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
}
.animate__lightSpeedOutLeft {
  -webkit-animation-name: lightSpeedOutLeft;
  animation-name: lightSpeedOutLeft;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

/* Rotating entrances */
@-webkit-keyframes rotateIn {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateIn {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInDownLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInDownRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInUpLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInUpRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}

/* Rotating exits */
@-webkit-keyframes rotateOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
@keyframes rotateOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
.animate__rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
.animate__rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.animate__rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.animate__rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
.animate__rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}

/* Specials */
@-webkit-keyframes hinge {
  0% {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}
@keyframes hinge {
  0% {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }
  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}
.animate__hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-duration: calc(var(--animate-duration) * 2);
  animation-duration: calc(var(--animate-duration) * 2);
  -webkit-animation-name: hinge;
  animation-name: hinge;
  -webkit-transform-origin: top left;
  transform-origin: top left;
}

@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.animate__jackInTheBox {
  -webkit-animation-name: jackInTheBox;
  animation-name: jackInTheBox;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
@keyframes rollOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
.animate__rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

/* Zooming entrances */
@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
.animate__zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

/* Zooming exits */
@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
@keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.animate__zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
  }
}
@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
  }
}
.animate__zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
  -webkit-transform-origin: left center;
  transform-origin: left center;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
  }
}
@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
  }
}
.animate__zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
  -webkit-transform-origin: right center;
  transform-origin: right center;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

/* Sliding entrances */
@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

/* Sliding exits */
@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.animate__slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.animate__slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.animate__slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.animate__slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

@keyframes animateLeftToRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes animateSuccessToTransparent {
  0% {
    background-color: transparent;
    transform: scale(1);
  }
  50% {
    background-color: var(--x-color-success);
    transform: scale(1.1);
  }
  100% {
    background-color: var(--color-layer);
    transform: scale(1);
  }
}
@keyframes animateInFromLeft {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
.UiButton {
  font-weight: 700;
}
.UiButton.size-1 {
  line-height: 1;
  font-size: 1rem;
}

.UiInput .label {
  top: calc(-1 * 2 * var(--ui-spacing));
  font-size: var(--agFontSizeXs);
  font-weight: 600;
}
.UiInput input::placeholder,
.UiInput select::placeholder {
  height: initial;
  line-height: initial;
}

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

html {
  --z-index-covid-reg-form: 900;
  --z-index-toolbar: 1000;
  --z-index-button-bottom: 1100;
  --z-index-connect: 1000;
  --UiButton-font-size-0: 1rem;
  --MenuProductCardIcon-container-size: 46px;
  --MenuProductCardIcon-container-size-large: 80px;
  --bottom-nav-height: 60px;
  --bottom-nav-container-height: calc(var(--bottom-nav-height) + 2 * var(--ui-spacing));
  --bottom-nav-border-radius: 40px;
  --border-radius-large: 10px;
  --button-input-height: 44px;
  --button-border-radius: 8px;
  --input-border-radius: 40px;
  --drawer-max-width: 512px;
}

html[dark] {
  --space: 4px;
  --space1: calc(1 * var(--space));
  --space2: calc(2 * var(--space));
  --space4: calc(4 * var(--space));
  --ui-color-overlay: rgba(0, 0, 0, 0.75);
  --ui-box-shadow: 0 2px 8px black;
  --ui-color-input: #292929;
  --color-layer: rgba(255, 255, 255, 0.06);
  --color-info-opacity: rgba(66, 165, 245, 0.25);
  --color-warning-opacity: rgba(255, 181, 0, 0.25);
  --color-error-opacity: rgba(239, 83, 80, 0.25);
  --UiTable-row-divider-color: var(--color-layer);
  --UiButton-filled-default-background-color: rgba(0, 0, 0, 0.5);
  --UiButton-filled-default-background-color: rgba(255, 255, 255, 0.1);
  --bottom-nav-background: var(--ui-color-input);
  --bottom-nav-box-shadow: 0 0 12px var(--x-color-body);
  --bottom-nav-tab-color-inactive: #8e8e8e;
  --bottom-nav-tab-color-active: #fff;
  --XDrawerBottom-z-index: var(--UiDialog-z-index);
  --XOverlay-z-index: calc(1 + var(--XDrawerBottom-z-index));
}

@-webkit-keyframes medium-editor-image-loading {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes medium-editor-image-loading {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-webkit-keyframes medium-editor-pop-upwards {
  0% {
    opacity: 0;
    -webkit-transform: matrix(0.97, 0, 0, 1, 0, 12);
    transform: matrix(0.97, 0, 0, 1, 0, 12);
  }
  20% {
    opacity: 0.7;
    -webkit-transform: matrix(0.99, 0, 0, 1, 0, 2);
    transform: matrix(0.99, 0, 0, 1, 0, 2);
  }
  40% {
    opacity: 1;
    -webkit-transform: matrix(1, 0, 0, 1, 0, -1);
    transform: matrix(1, 0, 0, 1, 0, -1);
  }
  100% {
    -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
    transform: matrix(1, 0, 0, 1, 0, 0);
  }
}
@keyframes medium-editor-pop-upwards {
  0% {
    opacity: 0;
    -webkit-transform: matrix(0.97, 0, 0, 1, 0, 12);
    transform: matrix(0.97, 0, 0, 1, 0, 12);
  }
  20% {
    opacity: 0.7;
    -webkit-transform: matrix(0.99, 0, 0, 1, 0, 2);
    transform: matrix(0.99, 0, 0, 1, 0, 2);
  }
  40% {
    opacity: 1;
    -webkit-transform: matrix(1, 0, 0, 1, 0, -1);
    transform: matrix(1, 0, 0, 1, 0, -1);
  }
  100% {
    -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
    transform: matrix(1, 0, 0, 1, 0, 0);
  }
}
.medium-editor-anchor-preview {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  left: 0;
  line-height: 1.4;
  max-width: 280px;
  position: absolute;
  text-align: center;
  top: 0;
  word-break: break-all;
  word-wrap: break-word;
  visibility: hidden;
  z-index: 2000;
}

.medium-editor-anchor-preview a {
  color: #fff;
  display: inline-block;
  margin: 5px 5px 10px;
}

.medium-editor-anchor-preview-active {
  visibility: visible;
}

.medium-editor-dragover {
  background: #ddd;
}

.medium-editor-image-loading {
  -webkit-animation: medium-editor-image-loading 1s infinite ease-in-out;
  animation: medium-editor-image-loading 1s infinite ease-in-out;
  background-color: #333;
  border-radius: 100%;
  display: inline-block;
  height: 40px;
  width: 40px;
}

.medium-editor-placeholder {
  position: relative;
}

.medium-editor-placeholder:after {
  content: attr(data-placeholder) !important;
  font-style: italic;
  position: absolute;
  left: 0;
  top: 0;
  white-space: pre;
  padding: inherit;
  margin: inherit;
}

.medium-editor-placeholder-relative {
  position: relative;
}

.medium-editor-placeholder-relative:after {
  content: attr(data-placeholder) !important;
  font-style: italic;
  position: relative;
  white-space: pre;
  padding: inherit;
  margin: inherit;
}

.medium-toolbar-arrow-under:after, .medium-toolbar-arrow-over:before {
  border-style: solid;
  content: "";
  display: block;
  height: 0;
  left: 50%;
  margin-left: -8px;
  position: absolute;
  width: 0;
}

.medium-toolbar-arrow-under:after {
  border-width: 8px 8px 0 8px;
}

.medium-toolbar-arrow-over:before {
  border-width: 0 8px 8px 8px;
  top: -8px;
}

.medium-editor-toolbar {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  left: 0;
  position: absolute;
  top: 0;
  visibility: hidden;
  z-index: 2000;
}

.medium-editor-toolbar ul {
  margin: 0;
  padding: 0;
}

.medium-editor-toolbar li {
  float: left;
  list-style: none;
  margin: 0;
  padding: 0;
}

.medium-editor-toolbar li button {
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  font-size: 14px;
  line-height: 1.33;
  margin: 0;
  padding: 15px;
  text-decoration: none;
}

.medium-editor-toolbar li button:focus {
  outline: none;
}

.medium-editor-toolbar li .medium-editor-action-underline {
  text-decoration: underline;
}

.medium-editor-toolbar li .medium-editor-action-pre {
  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
  font-size: 12px;
  font-weight: 100;
  padding: 15px 0;
}

.medium-editor-toolbar-active {
  visibility: visible;
}

.medium-editor-sticky-toolbar {
  position: fixed;
  top: 1px;
}

.medium-editor-relative-toolbar {
  position: relative;
}

.medium-editor-toolbar-active.medium-editor-stalker-toolbar {
  -webkit-animation: medium-editor-pop-upwards 160ms forwards linear;
  animation: medium-editor-pop-upwards 160ms forwards linear;
}

.medium-editor-action-bold {
  font-weight: bolder;
}

.medium-editor-action-italic {
  font-style: italic;
}

.medium-editor-toolbar-form {
  display: none;
}

.medium-editor-toolbar-form input,
.medium-editor-toolbar-form a {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.medium-editor-toolbar-form .medium-editor-toolbar-form-row {
  line-height: 14px;
  margin-left: 5px;
  padding-bottom: 5px;
}

.medium-editor-toolbar-form .medium-editor-toolbar-input,
.medium-editor-toolbar-form label {
  border: none;
  box-sizing: border-box;
  font-size: 14px;
  margin: 0;
  padding: 6px;
  width: 316px;
  display: inline-block;
}

.medium-editor-toolbar-form .medium-editor-toolbar-input:focus,
.medium-editor-toolbar-form label:focus {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  box-shadow: none;
  outline: 0;
}

.medium-editor-toolbar-form a {
  display: inline-block;
  font-size: 24px;
  font-weight: bolder;
  margin: 0 10px;
  text-decoration: none;
}

.medium-editor-toolbar-form-active {
  display: block;
}

.medium-editor-toolbar-actions:after {
  clear: both;
  content: "";
  display: table;
}

.medium-editor-element {
  word-wrap: break-word;
  min-height: 30px;
}

.medium-editor-element img {
  max-width: 100%;
}

.medium-editor-element sub {
  vertical-align: sub;
}

.medium-editor-element sup {
  vertical-align: super;
}

.medium-editor-hidden {
  display: none;
}

.medium-toolbar-arrow-under:after {
  border-color: #242424 transparent transparent transparent;
  top: 50px;
}

.medium-toolbar-arrow-over:before {
  border-color: transparent transparent #242424 transparent;
  top: -8px;
}

.medium-editor-toolbar {
  background-color: #242424;
  background: -webkit-linear-gradient(top, #242424, rgba(36, 36, 36, 0.75));
  background: linear-gradient(to bottom, #242424, rgba(36, 36, 36, 0.75));
  border: 1px solid #000;
  border-radius: 5px;
  box-shadow: 0 0 3px #000;
}

.medium-editor-toolbar li button {
  background-color: #242424;
  background: -webkit-linear-gradient(top, #242424, rgba(36, 36, 36, 0.89));
  background: linear-gradient(to bottom, #242424, rgba(36, 36, 36, 0.89));
  border: 0;
  border-right: 1px solid #000;
  border-left: 1px solid #333;
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  color: #fff;
  height: 50px;
  min-width: 50px;
  -webkit-transition: background-color 0.2s ease-in;
  transition: background-color 0.2s ease-in;
}

.medium-editor-toolbar li button:hover {
  background-color: #000;
  color: yellow;
}

.medium-editor-toolbar li .medium-editor-button-first {
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
}

.medium-editor-toolbar li .medium-editor-button-last {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}

.medium-editor-toolbar li .medium-editor-button-active {
  background-color: #000;
  background: -webkit-linear-gradient(top, #242424, rgba(0, 0, 0, 0.89));
  background: linear-gradient(to bottom, #242424, rgba(0, 0, 0, 0.89));
  color: #fff;
}

.medium-editor-toolbar-form {
  background: #242424;
  border-radius: 5px;
  color: #999;
}

.medium-editor-toolbar-form .medium-editor-toolbar-input {
  background: #242424;
  box-sizing: border-box;
  color: #ccc;
  height: 50px;
}

.medium-editor-toolbar-form a {
  color: #fff;
}

.medium-editor-toolbar-anchor-preview {
  background: #242424;
  border-radius: 5px;
  color: #fff;
}

.medium-editor-placeholder:after {
  color: #b3b3b1;
}

html[theme=light] {
  --x-color-body: #f9f9f9;
  --x-color-layer: rgba(0, 0, 0, 0.05);
  --x-color-divider: #ddd;
  --x-color-surface: white;
  --x-color-overlay: rgba(0, 0, 0, 0.5);
  --x-color-washed: rgba(0, 0, 0, 0.25);
  --x-color-washed-hover: rgba(0, 0, 0, 0.05);
  --x-color-text-primary: rgb(32, 34, 35);
  --x-color-text-secondary: #717171;
  --x-color-text-grey2: #3c3b41;
  --x-color-text-grey3: #5b5a60;
  --XLayout-header-background-color: var(--XCard-background-color);
  --XLayout-header-box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 2px;
  --XLayout-sidebar-background-color: var(--x-color-body);
  --XLayout-sidebar-overlay-background-color: rgba(0, 0, 0, 0.75);
  --XCard-background-color: #fff;
  --XCard-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 8px;
  --XInput-label-background-color: var(--x-color-body);
  --XInput-background-color: var(--x-color-layer);
  --XInput-border: 1px solid transparent;
  --XList-box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 8px;
  --XDrawer-background-color: var(--x-color-body);
}

html[theme=dark] {
  --x-color-body: #000;
  --x-color-layer: rgba(255, 255, 255, 0.1);
  --x-color-divider: var(--x-color-text-grey2);
  --x-color-surface: #1c1c1e;
  --x-color-overlay: rgba(0, 0, 0, 0.75);
  --x-color-washed: rgba(255, 255, 255, 0.25);
  --x-color-washed-hover: rgba(255, 255, 255, 0.1);
  --x-color-text-primary: #ffffff;
  --x-color-text-secondary: #99989e;
  --x-color-text-grey2: #3c3b41;
  --x-color-text-grey3: #5b5a60;
  --XLayout-header-background-color: var(--XCard-background-color);
  --XLayout-header-box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 2px;
  --XLayout-sidebar-background-color: var(--x-color-body);
  --XLayout-sidebar-overlay-background-color: rgba(0, 0, 0, 0.75);
  --XCard-background-color: var(--x-color-surface);
  --XCard-box-shadow: var(--XList-box-shadow);
  --XInput-label-background-color: var(--x-color-surface);
  --XInput-background-color: var(--x-color-layer);
  --XInput-border: none;
  --XList-box-shadow: 0 2px 8px rgb(15, 15, 15);
  --XDrawer-background-color: var(--x-color-body);
}

html[theme=blue] {
  --x-color-body: rgb(32, 33, 36);
  --x-color-layer: rgba(174, 203, 250, 0.05);
  --x-color-divider: rgb(40, 41, 44);
  --x-color-surface: rgb(39, 41, 47);
  --x-color-overlay: rgba(0, 0, 0, 0.75);
  --x-color-washed: rgba(255, 255, 255, 0.25);
  --x-color-washed-hover: rgba(255, 255, 255, 0.1);
  --x-color-text-primary: #ffffff;
  --x-color-text-secondary: #99989e;
  --x-color-text-grey2: #3c3b41;
  --x-color-text-grey3: #5b5a60;
  --XLayout-header-background-color: var(--XCard-background-color);
  --XLayout-header-box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 2px;
  --XLayout-sidebar-background-color: var(--XCard-background-color);
  --XLayout-sidebar-overlay-background-color: rgba(0, 0, 0, 0.75);
  --XCard-background-color: var(--x-color-surface);
  --XCard-box-shadow: var(--XList-box-shadow);
  --XInput-label-background-color: var(--x-color-body);
  --XInput-background-color: var(--x-color-layer);
  --XInput-border: none;
  --XList-box-shadow: 0 2px 8px rgb(20, 21, 24);
  --XDrawer-background-color: var(--x-color-body);
}

html {
  --x-gap: 4px;
  --x-gap1: calc(1 * var(--x-gap));
  --x-gap2: calc(2 * var(--x-gap));
  --x-gap3: calc(3 * var(--x-gap));
  --x-gap4: calc(4 * var(--x-gap));
  --x-gap5: calc(5 * var(--x-gap));
  --x-gap6: calc(6 * var(--x-gap));
  --x-gap7: calc(7 * var(--x-gap));
  --x-gap8: calc(8 * var(--x-gap));
  --x-size-multiplier: 8;
  --x-size--2: calc((0 + var(--x-size-multiplier)) * var(--x-gap));
  --x-size--1: calc((1 + var(--x-size-multiplier)) * var(--x-gap));
  --x-size-0: calc((2 + var(--x-size-multiplier)) * var(--x-gap));
  --x-size-1: calc((3 + var(--x-size-multiplier)) * var(--x-gap));
  --x-size-2: calc((4 + var(--x-size-multiplier)) * var(--x-gap));
  --x-size-3: calc((5 + var(--x-size-multiplier)) * var(--x-gap));
  --x-size-4: calc((6 + var(--x-size-multiplier)) * var(--x-gap));
  --x-section-gap: var(--x-gap4);
  --x-font-size-step: 2px;
  --x-font-size--4: calc(var(--x-font-size-0) - 4 * var(--x-font-size-step));
  --x-font-size--3: calc(var(--x-font-size-0) - 3 * var(--x-font-size-step));
  --x-font-size--2: calc(var(--x-font-size-0) - 2 * var(--x-font-size-step));
  --x-font-size--1: calc(var(--x-font-size-0) - 1 * var(--x-font-size-step));
  --x-font-size-0: 1rem;
  --x-font-size-1: calc(var(--x-font-size-0) + 1 * var(--x-font-size-step));
  --x-font-size-2: calc(var(--x-font-size-0) + 2 * var(--x-font-size-step));
  --x-font-size-3: calc(var(--x-font-size-0) + 3 * var(--x-font-size-step));
  --x-font-size-4: calc(var(--x-font-size-0) + 4 * var(--x-font-size-step));
  --x-font-size-5: calc(var(--x-font-size-0) + 5 * var(--x-font-size-step));
  --x-font-size-6: calc(var(--x-font-size-0) + 6 * var(--x-font-size-step));
  --x-font-size-7: calc(var(--x-font-size-0) + 7 * var(--x-font-size-step));
  --x-font-size-8: calc(var(--x-font-size-0) + 8 * var(--x-font-size-step));
  --x-font-size-9: calc(var(--x-font-size-0) + 9 * var(--x-font-size-step));
  --x-font-size-10: calc(var(--x-font-size-0) + 10 * var(--x-font-size-step));
  --x-border-radius: 6px;
  --XButton-height: var(--x-size-0);
  --XButton-font-size: var(--x-font-size-0);
  --XButton-border-radius: 40px;
  --XButton-icon-font-size: 24px;
  --XCard-border-radius: 16px;
  --XDialog-size-small-max-width: 320px;
  --XDialog-size-default-max-width: 768px;
  --XDrawer-max-width: 768px;
  --XDrawer-z-index: calc(var(--XOverlay-z-index) + 100);
  --XInput-height: var(--x-size-0);
  --XInput-spacing: var(--x-gap3);
  --XInput-helper-text-font-size: var(--x-font-size--1);
  --NavList-iconSize: 20px;
  --NavList-fontSize: var(--x-font-size-0);
  --XSectionHeader-font-size: var(--x-font-size-3);
  --XSectionHeader-font-weight: 500;
  --XInput-border-radius: 40px;
  --XInput-font-size: var(--x-font-size-0);
  --XLayout-content-container-padding: 0px;
  --XLayout-header-height: var(--x-size-4);
  --XLayout-header-z-index: 500;
  --XLayout-sidebar-width: 240px;
  --XLayout-sidebar-z-index: 400;
  --XLayout-sidebar-overlay-z-index: calc(var(--XLayout-header-z-index) + 1);
  --XTable-header-font-size: var(--x-font-size--3);
  --XTable-body-font-size: var(--x-font-size-0);
  --XTable-cell-spacing: var(--x-gap2);
  --XTable-cell-border-color: var(--x-color-layer);
  --XOverlay-z-index: 1000;
  --x-color-primary: rgb(45, 136, 255);
  --x-color-primary-light: rgba(75, 166, 255, 1);
  --x-color-primary-hover: rgba(75, 166, 255, 1);
  --x-color-secondary: rgb(245, 0, 93);
  --x-color-secondary-light: rgb(255, 30, 123);
  --x-color-secondary-hover: rgb(255, 30, 123);
  --x-color-success: rgba(26, 197, 103, 1);
  --x-color-success-light: rgba(56, 227, 133, 0.15);
  --x-color-success-hover: rgba(56, 227, 133, 1);
  --x-color-error: rgba(239, 83, 80, 1);
  --x-color-error-light: rgba(239, 83, 80, 0.15);
  --x-color-error-hover: rgba(255, 113, 110, 1);
  --x-color-warning: #ffb500;
  --x-color-warning-light: rgba(255, 181, 0, 0.15);
  --x-color-warning-hover: rgba(255, 181, 0, 1);
  --x-color-info: #42a5f5;
  --x-color-info-light: rgba(66, 165, 245, 0.15);
  --x-color-info-hover: rgba(66, 165, 245, 1);
}

@media (min-width: 1025px) {
  html {
    --XInput-border-radius: var(--x-border-radius);
    --NavList-fontSize: var(--x-font-size--1);
  }
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

* {
  box-sizing: border-box;
}

html {
  background-color: var(--x-color-body);
  color: var(--x-color-text-primary);
}

html.overflow-hidden body {
  overflow: hidden;
  position: relative;
}

img {
  max-width: 100%;
}

form {
  margin: 0;
}

.fullWidth {
  width: 100%;
}

.x-padding-1 {
  padding: calc(1 * var(--x-gap));
}

.x-padding-2 {
  padding: calc(2 * var(--x-gap));
}

.x-padding-3 {
  padding: calc(3 * var(--x-gap));
}

.x-padding-4 {
  padding: calc(4 * var(--x-gap));
}

.x-padding-5 {
  padding: calc(5 * var(--x-gap));
}

.x-padding-6 {
  padding: calc(6 * var(--x-gap));
}

.x-padding-7 {
  padding: calc(7 * var(--x-gap));
}

.x-padding-8 {
  padding: calc(8 * var(--x-gap));
}

.x-padding-9 {
  padding: calc(9 * var(--x-gap));
}

.x-padding-10 {
  padding: calc(10 * var(--x-gap));
}

.x-padding-11 {
  padding: calc(11 * var(--x-gap));
}

.x-padding-12 {
  padding: calc(12 * var(--x-gap));
}

.x-size--1 {
  height: var(--x-size--1);
}

.x-size-0 {
  height: var(--x-size-0);
}

.x-size-1 {
  height: var(--x-size-1);
}

.x-size-2 {
  height: var(--x-size-2);
}

.x-size-3 {
  height: var(--x-size-3);
}

.x-size-4 {
  height: var(--x-size-4);
}

@keyframes spinner {
  to {
    transform: rotate(360deg);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slideInLeft {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}
.Example .orderx-logo .st0 {
  fill: var(--x-color-text-primary);
}

.Example .orderx-logo .st1 {
  fill: var(--x-color-primary);
}

.XAlert {
  background-color: var(--x-color-body);
  padding: var(--x-gap4);
  border-radius: var(--x-border-radius);
  border-left: 2px solid var(--x-color-divider);
  position: relative;
}

.XAlert .alert-content {
  display: flex;
  align-items: center;
  min-height: 24px;
  width: 100%;
}

.XAlert .alert-content > div {
  flex: 1;
}

.XAlert.hasIcon {
  display: flex;
  align-items: flex-start;
}

.XAlert.hasIcon .icon-container {
  display: flex;
  margin-right: var(--x-gap4);
}

.XAlert.SUCCESS {
  background-color: var(--x-color-success-light);
  border-color: var(--x-color-success);
}

.XAlert.SUCCESS .icon-container {
  color: var(--x-color-success);
}

.XAlert.WARNING {
  background-color: var(--x-color-warning-light);
  border-color: var(--x-color-warning);
}

.XAlert.WARNING .icon-container {
  color: var(--x-color-warning);
}

.XAlert.ERROR {
  background-color: var(--x-color-error-light);
  border-color: var(--x-color-error);
}

.XAlert.ERROR .icon-container {
  color: var(--x-color-error);
}

.XBox.layer {
  background-color: var(--x-color-layer);
}

.XBox.rounded {
  border-radius: var(--x-border-radius);
}

.XBox.flex {
  display: flex;
}

.XBox.flexChildren > * {
  flex: 1;
}

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

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

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

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

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

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

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

.XBox.fullWidth {
  width: 100%;
}

.XBox.fullHeight {
  height: 100%;
}

.XBox.fontSize--4 {
  font-size: var(--x-font-size--4);
}

.XBox.fontSize--3 {
  font-size: var(--x-font-size--3);
}

.XBox.fontSize--2 {
  font-size: var(--x-font-size--2);
}

.XBox.fontSize--1 {
  font-size: var(--x-font-size--1);
}

.XBox.fontSize-0 {
  font-size: var(--x-font-size-0);
}

.XBox.fontSize-1 {
  font-size: var(--x-font-size-1);
}

.XBox.fontSize-2 {
  font-size: var(--x-font-size-2);
}

.XBox.fontSize-3 {
  font-size: var(--x-font-size-3);
}

.XBox.fontSize-4 {
  font-size: var(--x-font-size-4);
}

.XBox.fontSize-5 {
  font-size: var(--x-font-size-5);
}

.XBox.fontSize-6 {
  font-size: var(--x-font-size-6);
}

.XBox.fontSize-7 {
  font-size: var(--x-font-size-7);
}

.XBox.fontSize-8 {
  font-size: var(--x-font-size-8);
}

.XBox.fontSize-9 {
  font-size: var(--x-font-size-9);
}

.XBox.fontSize-10 {
  font-size: var(--x-font-size-10);
}

.XBox.x-gap-0.flex > *:not(:last-child) {
  margin-right: calc(0 * var(--x-gap));
}

.XBox.x-gap-0:not(.flex) {
  display: grid;
  grid-gap: calc(0 * var(--x-gap));
}

.XBox.x-gap-1.flex > *:not(:last-child) {
  margin-right: calc(1 * var(--x-gap));
}

.XBox.x-gap-1:not(.flex) {
  display: grid;
  grid-gap: calc(1 * var(--x-gap));
}

.XBox.x-gap-2.flex > *:not(:last-child) {
  margin-right: calc(2 * var(--x-gap));
}

.XBox.x-gap-2:not(.flex) {
  display: grid;
  grid-gap: calc(2 * var(--x-gap));
}

.XBox.x-gap-3.flex > *:not(:last-child) {
  margin-right: calc(3 * var(--x-gap));
}

.XBox.x-gap-3:not(.flex) {
  display: grid;
  grid-gap: calc(3 * var(--x-gap));
}

.XBox.x-gap-4.flex > *:not(:last-child) {
  margin-right: calc(4 * var(--x-gap));
}

.XBox.x-gap-4:not(.flex) {
  display: grid;
  grid-gap: calc(4 * var(--x-gap));
}

.XBox.x-gap-5.flex > *:not(:last-child) {
  margin-right: calc(5 * var(--x-gap));
}

.XBox.x-gap-5:not(.flex) {
  display: grid;
  grid-gap: calc(5 * var(--x-gap));
}

.XBox.x-gap-6.flex > *:not(:last-child) {
  margin-right: calc(6 * var(--x-gap));
}

.XBox.x-gap-6:not(.flex) {
  display: grid;
  grid-gap: calc(6 * var(--x-gap));
}

.XBox.x-gap-7.flex > *:not(:last-child) {
  margin-right: calc(7 * var(--x-gap));
}

.XBox.x-gap-7:not(.flex) {
  display: grid;
  grid-gap: calc(7 * var(--x-gap));
}

.XBox.x-gap-8.flex > *:not(:last-child) {
  margin-right: calc(8 * var(--x-gap));
}

.XBox.x-gap-8:not(.flex) {
  display: grid;
  grid-gap: calc(8 * var(--x-gap));
}

.XBox.x-gap-9.flex > *:not(:last-child) {
  margin-right: calc(9 * var(--x-gap));
}

.XBox.x-gap-9:not(.flex) {
  display: grid;
  grid-gap: calc(9 * var(--x-gap));
}

.XBox.x-gap-10.flex > *:not(:last-child) {
  margin-right: calc(10 * var(--x-gap));
}

.XBox.x-gap-10:not(.flex) {
  display: grid;
  grid-gap: calc(10 * var(--x-gap));
}

.XBox.x-gap-11.flex > *:not(:last-child) {
  margin-right: calc(11 * var(--x-gap));
}

.XBox.x-gap-11:not(.flex) {
  display: grid;
  grid-gap: calc(11 * var(--x-gap));
}

.XBox.x-gap-12.flex > *:not(:last-child) {
  margin-right: calc(12 * var(--x-gap));
}

.XBox.x-gap-12:not(.flex) {
  display: grid;
  grid-gap: calc(12 * var(--x-gap));
}

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

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

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

.XButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--XButton-font-size);
  font-weight: 500;
  color: var(--x-color-text-primary);
  border: 1px solid transparent;
  border-radius: var(--XButton-border-radius);
  cursor: pointer;
  padding: 0;
  padding-left: var(--x-gap4);
  padding-right: var(--x-gap4);
  position: relative;
  box-shadow: none;
  height: var(--XButton-height);
  text-decoration: none;
  transition: background-color 300ms, color 300ms, box-shadow 300ms;
  white-space: nowrap;
  touch-action: manipulation;
  user-select: none;
}

.XButton.prependIcon {
  padding-left: var(--x-gap2);
}

.XButton.appendIcon {
  padding-right: var(--x-gap2);
}

.XButton.disabled {
  cursor: auto;
  opacity: 0.5;
}

.XButton.iconOnly {
  height: var(--XButton-height);
  min-height: var(--XButton-height);
  width: var(--XButton-height);
  min-width: var(--XButton-height);
  padding: 0;
  border-radius: 100%;
}

.XButton:not(.iconOnly) > i {
  margin-right: var(--x-gap2);
}

.XButton i {
  font-size: var(--XButton-icon-font-size);
  transition: color 300ms;
}

.XButton .XLoader {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.XButton:focus {
  outline: none;
}

.XButton:hover:not(.variant-text), .XButton:focus:not(.variant-text) {
  box-shadow: 0 0 0 2px var(--x-color-layer);
}

.XButton.variant-text {
  background-color: transparent;
}

.XButton.variant-text.color-default {
  color: var(--x-color-text-primary);
}

.XButton.variant-outlined {
  background-color: transparent;
}

.XButton.variant-outlined.color-default {
  color: var(--x-color-text-primary);
  border: 1px solid var(--x-color-divider);
}

.XButton.variant-text:hover, .XButton.variant-outlined:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.variant-filled {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-primary.variant-text {
  background-color: transparent;
}

.XButton.color-primary.variant-text,
.XButton.color-primary.variant-text i {
  color: var(--x-color-primary);
}

.XButton.color-primary.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-primary.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-primary);
  color: var(--x-color-primary);
}

.XButton.color-primary.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-primary-hover);
}

.XButton.color-primary.variant-filled {
  background-color: var(--x-color-primary);
  color: white;
}

.XButton.color-primary.variant-filled:hover {
  background-color: var(--x-color-primary-hover);
}

.XButton.color-secondary.variant-text {
  background-color: transparent;
}

.XButton.color-secondary.variant-text,
.XButton.color-secondary.variant-text i {
  color: var(--x-color-secondary);
}

.XButton.color-secondary.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-secondary.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-secondary);
  color: var(--x-color-secondary);
}

.XButton.color-secondary.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-secondary-hover);
}

.XButton.color-secondary.variant-filled {
  background-color: var(--x-color-secondary);
  color: white;
}

.XButton.color-secondary.variant-filled:hover {
  background-color: var(--x-color-secondary-hover);
}

.XButton.color-success.variant-text {
  background-color: transparent;
}

.XButton.color-success.variant-text,
.XButton.color-success.variant-text i {
  color: var(--x-color-success);
}

.XButton.color-success.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-success.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-success);
  color: var(--x-color-success);
}

.XButton.color-success.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-success-hover);
}

.XButton.color-success.variant-filled {
  background-color: var(--x-color-success);
  color: white;
}

.XButton.color-success.variant-filled:hover {
  background-color: var(--x-color-success-hover);
}

.XButton.color-error.variant-text {
  background-color: transparent;
}

.XButton.color-error.variant-text,
.XButton.color-error.variant-text i {
  color: var(--x-color-error);
}

.XButton.color-error.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-error.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-error);
  color: var(--x-color-error);
}

.XButton.color-error.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-error-hover);
}

.XButton.color-error.variant-filled {
  background-color: var(--x-color-error);
  color: white;
}

.XButton.color-error.variant-filled:hover {
  background-color: var(--x-color-error-hover);
}

.XButton.color-warn.variant-text {
  background-color: transparent;
}

.XButton.color-warn.variant-text,
.XButton.color-warn.variant-text i {
  color: var(--x-color-warn);
}

.XButton.color-warn.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-warn.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-warn);
  color: var(--x-color-warn);
}

.XButton.color-warn.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-warn-hover);
}

.XButton.color-warn.variant-filled {
  background-color: var(--x-color-warn);
  color: white;
}

.XButton.color-warn.variant-filled:hover {
  background-color: var(--x-color-warn-hover);
}

.XButton.color-warning.variant-text {
  background-color: transparent;
}

.XButton.color-warning.variant-text,
.XButton.color-warning.variant-text i {
  color: var(--x-color-warning);
}

.XButton.color-warning.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-warning.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-warning);
  color: var(--x-color-warning);
}

.XButton.color-warning.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-warning-hover);
}

.XButton.color-warning.variant-filled {
  background-color: var(--x-color-warning);
  color: white;
}

.XButton.color-warning.variant-filled:hover {
  background-color: var(--x-color-warning-hover);
}

.XButton.color-info.variant-text {
  background-color: transparent;
}

.XButton.color-info.variant-text,
.XButton.color-info.variant-text i {
  color: var(--x-color-info);
}

.XButton.color-info.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-info.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-info);
  color: var(--x-color-info);
}

.XButton.color-info.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-info-hover);
}

.XButton.color-info.variant-filled {
  background-color: var(--x-color-info);
  color: white;
}

.XButton.color-info.variant-filled:hover {
  background-color: var(--x-color-info-hover);
}

.XButton.color-washed.variant-text {
  background-color: transparent;
}

.XButton.color-washed.variant-text,
.XButton.color-washed.variant-text i {
  color: var(--x-color-washed);
}

.XButton.color-washed.variant-text:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.color-washed.variant-outlined {
  background-color: transparent;
  border: 1px solid var(--x-color-washed);
  color: var(--x-color-washed);
}

.XButton.color-washed.variant-outlined:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--x-color-washed-hover);
}

.XButton.color-washed.variant-filled {
  background-color: var(--x-color-washed);
  color: white;
}

.XButton.color-washed.variant-filled:hover {
  background-color: var(--x-color-washed-hover);
}

.XButton.type-cta {
  border-radius: 40px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  width: 100%;
}

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

.XButtonGroup.XBox > *:first-child:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.XButtonGroup.XBox > *:not(:first-child) {
  border-left: 1px solid var(--XR-color-divider);
}

.XButtonGroup.XBox > *:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.XButtonGroup.XBox > *:last-child:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.XCard {
  background-color: var(--XCard-background-color);
  border-radius: var(--XCard-border-radius);
  box-shadow: var(--XCard-box-shadow);
}

.XCard .XCard {
  background-color: var(--x-color-layer);
}

.XDialog {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: grid;
  align-content: center;
  padding: var(--x-section-gap);
}

.XDialog.size-small > .content-container {
  max-width: var(--XDialog-size-small-max-width);
}

.XDialog > .content-container {
  display: flex;
  flex-direction: column;
  animation: XDialog-animate 200ms;
  margin: 0 auto;
  max-width: var(--XDialog-size-default-max-width);
  max-height: 100%;
  width: 100%;
  overflow: hidden;
}

.XDialog > .content-container > .dialog-content-container {
  overflow: auto;
}

@keyframes XDialog-animate {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.XDrawer {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--XDrawer-z-index);
  overflow: auto;
}

.XDrawer > .content-container {
  position: relative;
  animation: XDrawer-animateDrawer 200ms;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  max-width: var(--XDrawer-max-width);
  min-height: 100%;
  margin: 0 auto;
}

.XDrawer > .content-container > .content {
  background-color: var(--XDrawer-background-color);
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  width: 100%;
  margin-top: 20vh;
}

.XDrawer > .content-container > .content > .content-layer {
  border-radius: inherit;
}

@keyframes XDrawer-animateDrawer {
  0% {
    background-color: transparent;
    transform: translateY(25vh);
    opacity: 0;
  }
  100% {
    background-color: transparent;
    transform: translateY(0);
    opacity: 1;
  }
}
.XFormInput {
  --label-height: calc(var(--x-font-size--2) + 2 * 2px);
  display: block;
  position: relative;
}

.XFormInput.disabled {
  opacity: 0.5;
}

.XFormInput > .label {
  background-color: var(--XInput-label-background-color);
  position: absolute;
  transform: translate(var(--XInput-spacing), calc(-1 * var(--label-height) / 2));
  z-index: 1;
  color: var(--x-color-text-secondary);
  font-size: var(--x-font-size--2);
  white-space: nowrap;
  animation: fadeIn 300ms;
  border-radius: 4px;
  padding: 2px var(--x-gap);
  font-weight: 500;
}

.XFormInput > .input-container {
  display: flex;
  align-items: center;
  background-color: var(--XInput-background-color);
  border: var(--XInput-border);
  border-radius: var(--XInput-border-radius);
  height: var(--XInput-height);
}

.XFormInput > .input-container select,
.XFormInput > .input-container input {
  background-color: transparent;
  height: inherit;
  flex: 1;
  border: 0;
  color: var(--x-color-text-primary);
  font-size: var(--XInput-font-size);
  width: 0;
}

.XFormInput > .input-container select:focus,
.XFormInput > .input-container input:focus {
  outline: none;
}

.XFormInput > .input-container select {
  margin-right: var(--XInput-spacing);
}

.XFormInput:not(.hasAdornmentStart) select,
.XFormInput:not(.hasAdornmentStart) input {
  padding-left: var(--XInput-spacing);
}

.XFormInput > .helperText {
  padding: var(--x-gap);
  font-size: var(--XInput-helper-text-font-size);
}

.XFormInputContainer {
  --label-height: calc(var(--x-font-size--2) + 2 * 2px);
  display: block;
  position: relative;
}

.XFormInputContainer.disabled {
  opacity: 0.5;
}

.XFormInputContainer > .label {
  background-color: var(--XInput-label-background-color);
  position: absolute;
  transform: translate(var(--XInput-spacing), calc(-1 * var(--label-height) / 2));
  z-index: 1;
  color: var(--x-color-text-secondary);
  font-size: var(--x-font-size--2);
  white-space: nowrap;
  animation: fadeIn 300ms;
  border-radius: 4px;
  padding: 2px var(--x-gap);
  font-weight: 500;
}

.XFormInputContainer > .input-container {
  display: flex;
  align-items: center;
  background-color: var(--XInput-background-color);
  border: var(--XInput-border);
  border-radius: var(--XInput-border-radius);
  height: var(--XInput-height);
}

.XFormInputContainer > .input-container textarea,
.XFormInputContainer > .input-container select,
.XFormInputContainer > .input-container input {
  background-color: transparent;
  height: inherit;
  flex: 1;
  border: 0;
  color: var(--x-color-text-primary);
  font-size: var(--XInput-font-size);
  width: 0;
}

.XFormInputContainer > .input-container textarea:focus,
.XFormInputContainer > .input-container select:focus,
.XFormInputContainer > .input-container input:focus {
  outline: none;
}

.XFormInputContainer > .input-container select {
  margin-right: var(--XInput-spacing);
}

.XFormInputContainer:not(.hasAdornmentStart) select,
.XFormInputContainer:not(.hasAdornmentStart) input {
  padding-left: var(--XInput-spacing);
}

.XFormInputContainer > .helperText {
  padding: var(--x-gap);
  font-size: var(--XInput-helper-text-font-size);
}

.XFormInputEditor .input-container {
  display: block;
  height: auto;
  min-height: var(--XInput-height);
  overflow: auto;
  border-radius: var(--x-border-radius);
}

.XFormInputEditor .medium-editor-element {
  min-width: 100%;
  width: 100%;
  padding: var(--XInput-spacing);
}

.XFormInputTextarea .input-container {
  border-radius: var(--x-border-radius);
  height: auto;
}

.XFormInputTextarea textarea {
  height: 100%;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  padding: var(--XInput-spacing);
  min-height: var(--XInput-height);
}

.XGrid {
  display: grid;
}

.XLayout > .layout-header-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: var(--XLayout-header-z-index);
  height: var(--XLayout-header-height);
  background-color: var(--XLayout-header-background-color);
  box-shadow: var(--XLayout-header-box-shadow);
}

.XLayout > .layout-sidebar-left-container,
.XLayout > .layout-sidebar-right-container {
  position: fixed;
  top: 0;
  height: 100%;
  background-color: var(--XLayout-sidebar-background-color);
  width: var(--XLayout-sidebar-width);
  z-index: var(--XLayout-sidebar-z-index);
  overflow: auto;
}

.XLayout > .layout-sidebar-left-container {
  left: 0;
}

.XLayout > .layout-sidebar-right-container {
  right: 0;
}

.XLayout.header > .layout-content-container {
  padding-top: var(--XLayout-header-height);
}

@media (max-width: 1024px) {
  .XLayout > .layout-sidebar-left-container {
    transform: translateX(-100%);
  }
  .XLayout > .layout-sidebar-left-container,
  .XLayout > .layout-sidebar-right-container {
    z-index: calc(2 + var(--XLayout-header-z-index));
    transition: transform 300ms;
  }
  .XLayout > .sidebar-overlay {
    background-color: var(--x-color-overlay);
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: calc(1 + var(--XLayout-header-z-index));
    transition: opacity 300ms;
    transform: translateX(-100%);
    opacity: 0;
  }
  .XLayout.isSidebarOpen > .sidebar-overlay {
    transform: translateX(0);
    opacity: 1;
  }
  .XLayout.isSidebarOpen > .layout-sidebar-left-container,
  .XLayout.isSidebarOpen > .layout-sidebar-right-container {
    transform: translateX(0);
  }
}
@media (min-width: 1025px) {
  .XLayout.header > .layout-sidebar-left-container,
  .XLayout.header > .layout-sidebar-right-container {
    padding-top: var(--XLayout-header-height);
  }
  .XLayout.sidebarLeft > .layout-content-container {
    padding-left: var(--XLayout-sidebar-width);
  }
  .XLayout.sidebarRight > .layout-content-container {
    padding-right: var(--XLayout-sidebar-width);
  }
  .XLayout > .sidebar-overlay {
    display: none;
  }
}
.XLayoutContainer {
  max-width: 1200px;
  margin: 0 auto;
}

@media (min-width: 2000px) {
  .XLayoutContainer {
    max-width: 1600px;
    margin: 0 auto;
  }
}
.XList > .items-container {
  background-color: var(--XCard-background-color);
  border-radius: var(--XCard-border-radius);
  border: 0;
  box-shadow: var(--XList-box-shadow);
}

.XList > .title {
  display: block;
  font-size: var(--x-font-size--2);
  color: var(--x-color-text-secondary);
  text-transform: uppercase;
  padding-left: var(--x-gap3);
  padding-bottom: var(--x-gap2);
}

.XList .subtitle {
  color: var(--x-color-text-secondary);
  font-size: var(--x-font-size--1);
}

.XList .item {
  display: flex;
  align-items: center;
  padding-left: var(--x-gap3);
  min-height: var(--x-size-10);
  text-decoration: none;
}

.XList .item .icon-left {
  margin-right: var(--x-gap3);
}

.XList .item .item-content {
  align-items: center;
  justify-content: space-between;
  flex: 1;
  padding: var(--x-gap3) 0;
  padding-right: var(--x-gap2);
  line-height: 1.25;
}

.XList .item .item-content .XIcon {
  color: var(--x-color-text-grey3);
}

.XList .item .content-right {
  color: var(--x-color-text-secondary);
}

.XList .item:not(:last-child) .item-content {
  border-bottom: 1px solid var(--x-color-layer);
}

.XList .item.toggle .item-content {
  padding: var(--x-gap2) var(--x-gap2) var(--x-gap2) 0;
}

.XList .item.toggle .switch {
  position: relative;
  display: inline-block;
  width: 51px;
  height: 31px;
}

.XList .item.toggle .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.XList .item.toggle .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--x-color-layer);
  transition: 0.2s;
}

.XList .item.toggle .slider:before {
  position: absolute;
  content: "";
  height: 27px;
  width: 27px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  transition: 0.2s;
}

.XList .item.toggle input:checked + .slider {
  background-color: var(--x-color-success);
}

.XList .item.toggle input:focus + .slider {
  box-shadow: 0 0 1px var(--x-color-success);
}

.XList .item.toggle input:checked + .slider:before {
  transform: translateX(20px);
}

.XList .item.toggle .slider.round {
  border-radius: 34px;
}

.XList .item.toggle .slider.round:before {
  border-radius: 50%;
}

.XList2 > label {
  display: block;
  font-size: var(--x-font-size--2);
  color: var(--x-color-text-secondary);
  text-transform: uppercase;
  padding-left: var(--x-section-gap);
  padding-bottom: var(--x-gap2);
}

.XList2 .items-container {
  background-color: var(--XCard-background-color);
  border-radius: var(--XCard-border-radius);
  border: 0;
  box-shadow: var(--XList-box-shadow);
}

.XList2 .items-container .item {
  display: grid;
  grid-template-columns: auto var(--x-gap3) 1fr;
  touch-action: manipulation;
  user-select: none;
}

.XList2 .items-container .item:not(:last-child) .content {
  border-bottom: 1px solid var(--x-color-divider);
}

.XList2 .items-container .item .icon-container,
.XList2 .items-container .item .icon-container .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.XList2 .items-container .item .icon-container .icon {
  width: var(--XButton-height);
  padding: var(--x-gap);
  padding-left: var(--x-gap2);
  padding-right: 0;
}

.XList2 .items-container .item .content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 0;
}

.XList2 .items-container .item .content .content-left {
  padding: var(--x-gap3) var(--x-gap3) var(--x-gap3) 0;
}

.XList2 .items-container .item .content .content-left .subtitle {
  color: var(--x-color-text-secondary);
  font-size: var(--x-font-size--1);
}

.XList2 .items-container .item .content .content-right {
  color: var(--x-color-text-secondary);
  padding: var(--x-gap);
}

.XList2 .items-container .item .content .content-right .content-right-content {
  padding-right: var(--x-gap2);
}

.XList2 .items-container .item .content .content-right .nav {
  color: var(--x-color-text-secondary);
}

.XLoader {
  display: block;
  position: relative;
  width: 100%;
  --XLoader-size--1: calc(var(--x-size--1) - var(--x-gap4));
  --XLoader-size-0: calc(var(--x-size-0) - var(--x-gap4));
  --XLoader-size-1: calc(var(--x-size-1) - var(--x-gap4));
  --XLoader-size-2: calc(var(--x-size-2) - var(--x-gap4));
  --XLoader-size-3: calc(var(--x-size-3) - var(--x-gap4));
  --XLoader-size-4: calc(var(--x-size-4) - var(--x-gap4));
}

.XLoader.size--1:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - var(--XLoader-size--1) / 2);
  left: calc(50% - var(--XLoader-size--1) / 2);
  width: var(--XLoader-size--1);
  height: var(--XLoader-size--1);
  border-radius: 50%;
  border: 2px solid var(--x-color-text-secondary);
  border-top-color: var(--x-color-text-primary);
  animation: spinner 0.6s linear infinite;
}

.XLoader.size-0:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - var(--XLoader-size-0) / 2);
  left: calc(50% - var(--XLoader-size-0) / 2);
  width: var(--XLoader-size-0);
  height: var(--XLoader-size-0);
  border-radius: 50%;
  border: 2px solid var(--x-color-text-secondary);
  border-top-color: var(--x-color-text-primary);
  animation: spinner 0.6s linear infinite;
}

.XLoader.size-1:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - var(--XLoader-size-1) / 2);
  left: calc(50% - var(--XLoader-size-1) / 2);
  width: var(--XLoader-size-1);
  height: var(--XLoader-size-1);
  border-radius: 50%;
  border: 2px solid var(--x-color-text-secondary);
  border-top-color: var(--x-color-text-primary);
  animation: spinner 0.6s linear infinite;
}

.XLoader.size-2:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - var(--XLoader-size-2) / 2);
  left: calc(50% - var(--XLoader-size-2) / 2);
  width: var(--XLoader-size-2);
  height: var(--XLoader-size-2);
  border-radius: 50%;
  border: 2px solid var(--x-color-text-secondary);
  border-top-color: var(--x-color-text-primary);
  animation: spinner 0.6s linear infinite;
}

.XLoader.size-3:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - var(--XLoader-size-3) / 2);
  left: calc(50% - var(--XLoader-size-3) / 2);
  width: var(--XLoader-size-3);
  height: var(--XLoader-size-3);
  border-radius: 50%;
  border: 2px solid var(--x-color-text-secondary);
  border-top-color: var(--x-color-text-primary);
  animation: spinner 0.6s linear infinite;
}

.XLoader.size-4:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - var(--XLoader-size-4) / 2);
  left: calc(50% - var(--XLoader-size-4) / 2);
  width: var(--XLoader-size-4);
  height: var(--XLoader-size-4);
  border-radius: 50%;
  border: 2px solid var(--x-color-text-secondary);
  border-top-color: var(--x-color-text-primary);
  animation: spinner 0.6s linear infinite;
}

.XNavList {
  padding: var(--XR-gap2);
  min-width: var(--XLayout-sidebar-width);
}

.XNavList > .title {
  display: flex;
  align-items: center;
  font-size: var(--x-font-size--2);
  font-weight: bold;
  color: var(--XR-color-textSecondary);
  text-transform: uppercase;
  padding-left: var(--XR-gap2);
  height: var(--XR-size-x-1);
}

.XNavList .XR-Button {
  background-color: transparent;
  justify-content: flex-start;
  font-size: var(--XR-fontSize-1);
  transition: font-weight 300ms;
  color: var(--XR-color-textSecondary);
  padding-left: 0 !important;
  grid-gap: 0;
  min-height: var(--XR-size-x-1);
}

.XNavList .XR-Button.root:not(.hasIcon) {
  padding-left: var(--XR-gap4) !important;
}

.XNavList .XR-Button:before {
  content: "";
  position: absolute;
  left: calc(-1 * var(--XR-gap2));
  top: 0;
  width: 3px;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  height: 100%;
  background-color: transparent;
  transition: background-color 300ms;
}

.XNavList .XR-Button.active {
  background-color: var(--XR-Touchable-default-backgroundColor);
  color: var(--XR-color-primary);
  font-weight: bold;
}

.XNavList .XR-Button.active:before {
  background-color: var(--XR-color-primary);
}

.XNavList .start-container {
  width: var(--XR-size-x3);
  text-align: center;
}

.XNavList,
.XNavList .sub-container {
  display: grid;
}

.XNavTab {
  display: flex;
  overflow: auto;
  position: relative;
  padding: var(--x-gap2);
}

.XNavTab:before {
  content: "";
  height: 1px;
  width: 100%;
  background-color: var(--x-color-divider);
  position: absolute;
  bottom: 0;
}

.XNavTab > .tab {
  position: relative;
  white-space: nowrap;
  color: var(--x-color-text-secondary) !important;
}

.XNavTab > .tab:before {
  content: "";
  height: 2px;
  background-color: var(--x-color-text-primary);
  position: absolute;
  bottom: -8px;
  left: 50%;
  border-radius: var(--x-border-radius);
  transition: 300ms;
  width: 0;
}

.XNavTab > .tab:hover, .XNavTab > .tab.active {
  cursor: pointer;
  color: var(--x-color-text-primary) !important;
}

.XNavTab > .tab:hover:before, .XNavTab > .tab.active:before {
  left: 10%;
  width: 80%;
}

.XNavTab > .tab i {
  font-size: 20px;
}

.XNavTab > .tabs-container {
  display: flex;
}

.XOverlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--XOverlay-z-index);
  overflow: auto;
  animation: XOverlay-animateBackground 200ms forwards;
}

@keyframes XOverlay-animateBackground {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: var(--x-color-overlay);
  }
}
.XSection {
  overflow: auto;
  padding: calc(var(--x-section-gap) / 2) var(--x-section-gap);
}

.XSection.overflowInitial {
  overflow: initial;
}

.XSection:first-child {
  padding-top: var(--x-section-gap);
}

.XSection:last-child {
  padding-bottom: var(--x-section-gap);
}

.XSection.fullWidth {
  padding-left: 0;
  padding-right: 0;
}

.XSectionFooter {
  padding: var(--x-section-gap);
}

.XSectionFooter:not(:first-child) {
  padding-top: calc(var(--x-section-gap) / 2);
}

.XSectionHeader {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: var(--x-section-gap);
  padding-bottom: calc(var(--x-section-gap) / 2);
  overflow: auto;
}

.XSectionHeader:last-child {
  padding-bottom: var(--x-section-gap);
}

.XSectionHeader .row-upper {
  height: var(--x-size-0);
}

.XSectionHeader .title {
  display: flex;
  align-items: center;
  font-size: var(--XSectionHeader-font-size);
  font-weight: var(--XSectionHeader-font-weight);
  min-height: var(--x-size-0);
}

.XTable {
  overflow: auto;
  width: 100%;
  border-spacing: 0;
}

.XTable > table {
  width: inherit;
  border-spacing: inherit;
}

.XTable thead {
  color: var(--x-color-text-secondary);
  font-size: var(--XTable-header-font-size);
  font-weight: bold;
  text-transform: uppercase;
  white-space: nowrap;
}

.XTable td {
  padding: var(--XTable-cell-spacing) calc(2 * var(--XTable-cell-spacing)) var(--XTable-cell-spacing) var(--XTable-cell-spacing);
}

.XTable td:last-child {
  padding-right: var(--XTable-cell-spacing);
}

.XTable thead td,
.XTable tbody tr:not(:last-child) td {
  border-bottom: 1px solid var(--XTable-cell-border-color);
}

.XTable tbody tr:not(:last-child) td {
  font-size: var(--XTable-body-font-size);
}

.XTableCell.toggle, .XTableCell.checkbox {
  padding: 0;
  color: var(--XR-color-textSecondary);
  height: var(--XR-Button-height);
  width: var(--XR-Button-height);
}

.XTableCell.toggle {
  cursor: pointer;
}

.XTableCell.toggle i {
  font-size: var(--x-size--2);
}

.XTableCell.toggle:not(.checked) {
  color: var(--x-color-washed);
}

.XTableCell.toggle .checked {
  color: var(--XR-color-success);
}

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

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

.XText.color-primary {
  color: var(--x-color-primary);
}

.XText.color-secondary {
  color: var(--x-color-secondary);
}

.XText.color-success {
  color: var(--x-color-success);
}

.XText.color-error {
  color: var(--x-color-error);
}

.XText.color-washed {
  color: var(--x-color-washed);
}

.XText.size--4 {
  font-size: var(--x-font-size--4);
}

.XText.size--3 {
  font-size: var(--x-font-size--3);
}

.XText.size--2 {
  font-size: var(--x-font-size--2);
}

.XText.size--1 {
  font-size: var(--x-font-size--1);
}

.XText.size-0 {
  font-size: var(--x-font-size-0);
}

.XText.size-1 {
  font-size: var(--x-font-size-1);
}

.XText.size-2 {
  font-size: var(--x-font-size-2);
}

.XText.size-3 {
  font-size: var(--x-font-size-3);
}

.XText.size-4 {
  font-size: var(--x-font-size-4);
}

.XText.size-5 {
  font-size: var(--x-font-size-5);
}

.XText.size-6 {
  font-size: var(--x-font-size-6);
}

.XText.size-7 {
  font-size: var(--x-font-size-7);
}

.XText.size-8 {
  font-size: var(--x-font-size-8);
}

.XText.size-9 {
  font-size: var(--x-font-size-9);
}

.XText.size-10 {
  font-size: var(--x-font-size-10);
}

.XText.weight--1 {
  font-weight: 300;
}

.XText.weight-0 {
  font-weight: 400;
}

.XText.weight-1 {
  font-weight: 500;
}

.XText.weight-2 {
  font-weight: 600;
}

.XText.weight-3 {
  font-weight: 700;
}

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

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

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

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

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

.XText.whiteSpace-normal {
  white-space: normal;
}

.XText.whiteSpace-nowrap {
  white-space: nowrap;
}

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

.useDialog .XList {
  margin: var(--x-section-gap) var(--x-section-gap) calc(2 * var(--x-section-gap)) var(--x-section-gap);
}

.useDialog .XList:not(:last-child) {
  padding-bottom: 0;
}

@media (max-width: 767px) {
  .useDialog {
    display: flex;
    padding: 0;
  }
  .useDialog > .content-container {
    background-color: var(--x-color-body);
    border-radius: 0;
    height: 100%;
  }
  .useDialog > .content-container > .dialog-content-container {
    flex: 1;
  }
}
html[theme=dark] .useDialog .XList .items-container {
  background-color: var(--x-color-layer);
}

.XR-useForm {
  --XR-useForm-gap: var(--x-section-gap);
}

.XR-useForm.type-boolean {
  justify-content: flex-start;
  height: var(--XR-size-x0);
}

.XR-useForm.type-boolean i {
  width: var(--XR-size-x0);
}

.XR-useForm.type-boolean.variant-toggle {
  justify-content: space-between;
}

.XR-useForm.type-boolean.variant-toggle i {
  color: var(--XR-color-textSecondary);
  font-size: 40px;
}

.XR-useForm.type-boolean.variant-checkbox {
  border-color: var(--XR-color-success);
}

.XR-useForm.type-boolean.variant-checkbox i {
  border-right: 1px solid var(--XR-color-divider);
  font-size: 24px;
}

.XR-useForm.type-boolean.variant-toggle.isActive i, .XR-useForm.type-boolean.variant-checkbox.isActive i {
  color: var(--XR-color-success);
}

.XR-useForm.disabled {
  opacity: 0.5;
}

.XR-useForm .medium-editor-element {
  min-height: var(--XR-Input-height);
  padding: 0 var(--XR-useForm-gap);
  width: 100%;
}

.XR-useForm .medium-editor-element:after {
  top: 50%;
  transform: translateY(-50%);
}

.XR-useForm.type-select.select-toggle-button,
.XR-useForm .type-select.select-toggle-button {
  padding-left: var(--XR-gap4);
  position: relative;
}

.XR-useForm.type-select.select-toggle-button, .XR-useForm.type-select.select-item,
.XR-useForm .type-select.select-toggle-button,
.XR-useForm .type-select.select-item {
  display: flex;
  justify-content: space-between;
  padding-right: 0;
  min-height: var(--XR-Input-height);
}

.XR-useForm.type-select .select-item i,
.XR-useForm .type-select .select-item i {
  font-size: 24px;
  width: var(--XR-size-x0);
}

.XR-useForm.type-select .placeholder,
.XR-useForm .type-select .placeholder {
  color: var(--XR-color-textSecondary);
}

.XR-useForm.type-select .input-button-icon,
.XR-useForm .type-select .input-button-icon {
  border-left: 1px solid var(--x-color-layer);
  border-radius: 0;
}

.XR-useForm.input-container {
  background-color: var(--XR-Input-backgroundColor);
}

.XR-useForm.input-container {
  position: relative;
  display: flex;
  min-height: var(--XR-Input-height);
  color: var(--XR-color-textPrimary);
  font-size: var(--XR-Input-fontSize);
  border-radius: var(--XR-Input-borderRadius);
}

.XR-useForm.input-container .icon {
  background-color: transparent;
  color: var(--XR-color-textSecondary);
}

.XR-useForm.input-container textarea,
.XR-useForm.input-container input {
  flex: 1;
  width: 0;
  min-width: 120px;
  height: inherit;
  min-height: inherit;
  border: 0;
  background-color: transparent;
  border-radius: inherit;
  color: inherit;
  font-size: inherit;
}

.XR-useForm.input-container textarea:first-child,
.XR-useForm.input-container input:first-child {
  padding-left: var(--XR-useForm-gap);
}

.XR-useForm.input-container textarea:focus,
.XR-useForm.input-container input:focus {
  outline: none;
}

.XR-useForm.input-container textarea {
  padding: calc(var(--x-font-size-0) / 2 + 2px) 0;
}

.XR-useForm .floating-label {
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(var(--XR-useForm-gap), -50%);
  padding: 0 var(--x-gap);
  border-radius: 40px;
  font-size: var(--x-font-size--3);
  font-weight: bold;
  background-color: var(--XCard-background-color);
}

.medium-editor-toolbar {
  background: var(--XR-Card-backgroundColor);
  box-shadow: var(--XR-Card-boxShadow);
  border: none;
  border-radius: var(--XR-Card-borderRadius);
  overflow: hidden;
}

.medium-editor-toolbar .medium-editor-action {
  background: var(--XR-Card-backgroundColor);
  border: none;
}

.medium-editor-toolbar .medium-editor-action:hover {
  background: var(--x-color-washed-hover);
  color: var(--XR-color-textPrimary);
}

.medium-editor-toolbar .medium-editor-button-active {
  background: var(--XR-color-success) !important;
}

.useNavTabs.container {
  padding: var(--XR-Section-padding) 0;
}

.useNavTabs.tabs-container {
  display: flex;
  overflow: auto;
  position: relative;
  padding: var(--XR-gap2) 0;
}

.useNavTabs.tabs-container:before {
  content: "";
  position: absolute;
  bottom: 0;
  height: 1px;
  width: 100%;
  background-color: var(--XR-color-divider);
}

.useNavTabs .XButton {
  position: relative;
  white-space: nowrap;
  color: var(--XR-color-textSecondary) !important;
}

.useNavTabs .XButton:first-child {
  margin-left: var(--XR-gap2);
}

.useNavTabs .XButton:after {
  content: "";
  height: 2px;
  background-color: var(--XR-color-textPrimary);
  position: absolute;
  bottom: -8px;
  left: 50%;
  border-radius: var(--XR-borderRadius);
  transition: 300ms;
  width: 0;
}

.useNavTabs .XButton:hover, .useNavTabs .XButton.active {
  cursor: pointer;
  color: var(--XR-color-textPrimary) !important;
}

.useNavTabs .XButton:hover:after, .useNavTabs .XButton.active:after {
  left: 10%;
  width: 80%;
}

.useNavTabs .XButton i {
  font-size: 20px;
}

.useTable table {
  border-spacing: 0;
  border-collapse: collapse;
  width: 100%;
  font-size: var(--x-font-size-0);
}

.useTable thead .XButton {
  display: block;
  border-radius: 0;
  width: 100%;
  text-align: inherit;
  color: var(--x-color-text-secondary) !important;
}

.useTable table > tbody:nth-child(2) tr:first-child td {
  border-top: 1px solid var(--XTable-cell-border-color);
}

.useTable tbody td {
  padding: var(--XTable-cell-spacing) var(--x-gap4);
}

.useTable tbody td:not(.type-checkbox) {
  min-width: 160px;
}

.useTable tbody td.type-checkbox {
  padding: 0;
  height: var(--x-size-0);
  width: var(--x-size-0);
}

.useTable tbody td.type-checkbox .XButton {
  height: 100%;
  width: 100%;
  border-radius: 0;
}

.useTable tbody tr:not(:first-child) td {
  border-top: 1px solid var(--XTable-cell-border-color);
}

.useTable .pagination-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: var(--x-section-gap);
}

/**

 UI

 */
.XR-useDialog.overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: grid;
  align-content: center;
  padding: var(--XR-Section-padding);
}

.XR-useDialog.container {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  max-width: var(--XDialog-size-default-max-width);
  max-height: 100%;
  width: 100%;
  overflow: hidden;
}

.XR-useDialog.container.SMALL {
  max-width: var(--XDialog-size-small-max-width);
}

.XR-useDialog.container > .dialog-content-container {
  overflow: auto;
}

@media (max-width: 767px) {
  .XR-useDialog.overlay {
    display: flex;
    padding: 0;
  }
  .XR-useDialog.overlay .XR-useDialog.container {
    background-color: var(--XR-Card-backgroundColor);
    border-radius: 0;
    height: 100%;
  }
  .XR-useDialog.overlay .XR-useDialog.container > .dialog-content-container {
    flex: 1;
  }
}

:root {
  --toastify-color-light: #fff;
  --toastify-color-dark: #121212;
  --toastify-color-info: #3498db;
  --toastify-color-success: #07bc0c;
  --toastify-color-warning: #f1c40f;
  --toastify-color-error: #e74c3c;
  --toastify-color-transparent: rgba(255, 255, 255, 0.7);
  --toastify-icon-color-info: var(--toastify-color-info);
  --toastify-icon-color-success: var(--toastify-color-success);
  --toastify-icon-color-warning: var(--toastify-color-warning);
  --toastify-icon-color-error: var(--toastify-color-error);
  --toastify-toast-width: 320px;
  --toastify-toast-background: #fff;
  --toastify-toast-min-height: 64px;
  --toastify-toast-max-height: 800px;
  --toastify-font-family: sans-serif;
  --toastify-z-index: 9999;
  --toastify-text-color-light: #757575;
  --toastify-text-color-dark: #fff;
  --toastify-text-color-info: #fff;
  --toastify-text-color-success: #fff;
  --toastify-text-color-warning: #fff;
  --toastify-text-color-error: #fff;
  --toastify-spinner-color: #616161;
  --toastify-spinner-color-empty-area: #e0e0e0;
  --toastify-color-progress-light: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
  --toastify-color-progress-dark: #bb86fc;
  --toastify-color-progress-info: var(--toastify-color-info);
  --toastify-color-progress-success: var(--toastify-color-success);
  --toastify-color-progress-warning: var(--toastify-color-warning);
  --toastify-color-progress-error: var(--toastify-color-error);
}

.Toastify__toast-container {
  z-index: var(--toastify-z-index);
  -webkit-transform: translate3d(0, 0, var(--toastify-z-index) px);
  position: fixed;
  padding: 4px;
  width: var(--toastify-toast-width);
  box-sizing: border-box;
  color: #fff;
}

.Toastify__toast-container--top-left {
  top: 1em;
  left: 1em;
}

.Toastify__toast-container--top-center {
  top: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.Toastify__toast-container--top-right {
  top: 1em;
  right: 1em;
}

.Toastify__toast-container--bottom-left {
  bottom: 1em;
  left: 1em;
}

.Toastify__toast-container--bottom-center {
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.Toastify__toast-container--bottom-right {
  bottom: 1em;
  right: 1em;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast-container {
    width: 100vw;
    padding: 0;
    left: 0;
    margin: 0;
  }
  .Toastify__toast-container--top-left,
  .Toastify__toast-container--top-center,
  .Toastify__toast-container--top-right {
    top: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-left,
  .Toastify__toast-container--bottom-center,
  .Toastify__toast-container--bottom-right {
    bottom: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: 0;
    left: initial;
  }
}
.Toastify__toast {
  position: relative;
  min-height: var(--toastify-toast-min-height);
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 8px;
  border-radius: 4px;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-height: var(--toastify-toast-max-height);
  overflow: hidden;
  font-family: var(--toastify-font-family);
  cursor: pointer;
  direction: ltr;
}

.Toastify__toast--rtl {
  direction: rtl;
}

.Toastify__toast-body {
  margin: auto 0;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 6px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.Toastify__toast-body > div:last-child {
  -ms-flex: 1;
  flex: 1;
}

.Toastify__toast-icon {
  -webkit-margin-end: 10px;
  margin-inline-end: 10px;
  width: 20px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: -ms-flexbox;
  display: flex;
}

.Toastify--animate {
  animation-fill-mode: both;
  animation-duration: 0.7s;
}

.Toastify--animate-icon {
  animation-fill-mode: both;
  animation-duration: 0.3s;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast {
    margin-bottom: 0;
    border-radius: 0;
  }
}
.Toastify__toast-theme--dark {
  background: var(--toastify-color-dark);
  color: var(--toastify-text-color-dark);
}

.Toastify__toast-theme--light {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--default {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--info {
  color: var(--toastify-text-color-info);
  background: var(--toastify-color-info);
}

.Toastify__toast-theme--colored.Toastify__toast--success {
  color: var(--toastify-text-color-success);
  background: var(--toastify-color-success);
}

.Toastify__toast-theme--colored.Toastify__toast--warning {
  color: var(--toastify-text-color-warning);
  background: var(--toastify-color-warning);
}

.Toastify__toast-theme--colored.Toastify__toast--error {
  color: var(--toastify-text-color-error);
  background: var(--toastify-color-error);
}

.Toastify__progress-bar-theme--light {
  background: var(--toastify-color-progress-light);
}

.Toastify__progress-bar-theme--dark {
  background: var(--toastify-color-progress-dark);
}

.Toastify__progress-bar--info {
  background: var(--toastify-color-progress-info);
}

.Toastify__progress-bar--success {
  background: var(--toastify-color-progress-success);
}

.Toastify__progress-bar--warning {
  background: var(--toastify-color-progress-warning);
}

.Toastify__progress-bar--error {
  background: var(--toastify-color-progress-error);
}

.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error {
  background: var(--toastify-color-transparent);
}

.Toastify__close-button {
  color: #fff;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.Toastify__close-button--light {
  color: #000;
  opacity: 0.3;
}

.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}

.Toastify__close-button:hover,
.Toastify__close-button:focus {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}
.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  z-index: var(--toastify-z-index);
  opacity: 0.7;
  transform-origin: left;
}

.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}

.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}

.Toastify__progress-bar--rtl {
  right: 0;
  left: initial;
  transform-origin: right;
}

.Toastify__spinner {
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 2px solid;
  border-radius: 100%;
  border-color: var(--toastify-spinner-color-empty-area);
  border-right-color: var(--toastify-spinner-color);
  animation: Toastify__spin 0.65s linear infinite;
}

@keyframes Toastify__bounceInRight {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes Toastify__bounceInDown {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.Toastify__bounce-enter--top-left,
.Toastify__bounce-enter--bottom-left {
  animation-name: Toastify__bounceInLeft;
}

.Toastify__bounce-enter--top-right,
.Toastify__bounce-enter--bottom-right {
  animation-name: Toastify__bounceInRight;
}

.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}

.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--top-left,
.Toastify__bounce-exit--bottom-left {
  animation-name: Toastify__bounceOutLeft;
}

.Toastify__bounce-exit--top-right,
.Toastify__bounce-exit--bottom-right {
  animation-name: Toastify__bounceOutRight;
}

.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}

.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes Toastify__zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}
@keyframes Toastify__flipOut {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  from {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInLeft {
  from {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInUp {
  from {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInDown {
  from {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, 0, 0);
  }
}
@keyframes Toastify__slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, 0, 0);
  }
}
@keyframes Toastify__slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}
@keyframes Toastify__slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}
.Toastify__slide-enter--top-left,
.Toastify__slide-enter--bottom-left {
  animation-name: Toastify__slideInLeft;
}

.Toastify__slide-enter--top-right,
.Toastify__slide-enter--bottom-right {
  animation-name: Toastify__slideInRight;
}

.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}

.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--top-left,
.Toastify__slide-exit--bottom-left {
  animation-name: Toastify__slideOutLeft;
}

.Toastify__slide-exit--top-right,
.Toastify__slide-exit--bottom-right {
  animation-name: Toastify__slideOutRight;
}

.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
}

.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
}

@keyframes Toastify__spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.Toastify__toast-container {
  z-index: 9999;
  -webkit-transform: translate3d(0, 0, 9999px);
  position: fixed;
  padding: 4px;
  width: 320px;
  box-sizing: border-box;
  color: #fff;
}

.Toastify__toast-container--top-left {
  top: 1em;
  left: 1em;
}

.Toastify__toast-container--top-center {
  top: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.Toastify__toast-container--top-right {
  top: 1em;
  right: 1em;
}

.Toastify__toast-container--bottom-left {
  bottom: 1em;
  left: 1em;
}

.Toastify__toast-container--bottom-center {
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.Toastify__toast-container--bottom-right {
  bottom: 1em;
  right: 1em;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast-container {
    width: 100vw;
    padding: 0;
    left: 0;
    margin: 0;
  }
  .Toastify__toast-container--top-left,
  .Toastify__toast-container--top-center,
  .Toastify__toast-container--top-right {
    top: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-left,
  .Toastify__toast-container--bottom-center,
  .Toastify__toast-container--bottom-right {
    bottom: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: 0;
    left: initial;
  }
}
.Toastify__toast {
  position: relative;
  min-height: 64px;
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 8px;
  border-radius: 1px;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-height: 800px;
  overflow: hidden;
  font-family: sans-serif;
  cursor: pointer;
  direction: ltr;
}

.Toastify__toast--rtl {
  direction: rtl;
}

.Toastify__toast--dark {
  background: #121212;
  color: #fff;
}

.Toastify__toast--default {
  background: #fff;
  color: #aaa;
}

.Toastify__toast--info {
  background: #3498db;
}

.Toastify__toast--success {
  background: #07bc0c;
}

.Toastify__toast--warning {
  background: #f1c40f;
}

.Toastify__toast--error {
  background: #e74c3c;
}

.Toastify__toast-body {
  margin: auto 0;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast {
    margin-bottom: 0;
  }
}
.Toastify__close-button {
  color: #fff;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.Toastify__close-button--default {
  color: #000;
  opacity: 0.3;
}

.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}

.Toastify__close-button:hover,
.Toastify__close-button:focus {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}
.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  z-index: 9999;
  opacity: 0.7;
  background-color: rgba(255, 255, 255, 0.7);
  transform-origin: left;
}

.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}

.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}

.Toastify__progress-bar--rtl {
  right: 0;
  left: initial;
  transform-origin: right;
}

.Toastify__progress-bar--default {
  background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
}

.Toastify__progress-bar--dark {
  background: #bb86fc;
}

@keyframes Toastify__bounceInRight {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes Toastify__bounceInDown {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.Toastify__bounce-enter--top-left,
.Toastify__bounce-enter--bottom-left {
  animation-name: Toastify__bounceInLeft;
}

.Toastify__bounce-enter--top-right,
.Toastify__bounce-enter--bottom-right {
  animation-name: Toastify__bounceInRight;
}

.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}

.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--top-left,
.Toastify__bounce-exit--bottom-left {
  animation-name: Toastify__bounceOutLeft;
}

.Toastify__bounce-exit--top-right,
.Toastify__bounce-exit--bottom-right {
  animation-name: Toastify__bounceOutRight;
}

.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}

.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes Toastify__zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}
@keyframes Toastify__flipOut {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  from {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInLeft {
  from {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInUp {
  from {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInDown {
  from {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, 0, 0);
  }
}
@keyframes Toastify__slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, 0, 0);
  }
}
@keyframes Toastify__slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}
@keyframes Toastify__slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}
.Toastify__slide-enter--top-left,
.Toastify__slide-enter--bottom-left {
  animation-name: Toastify__slideInLeft;
}

.Toastify__slide-enter--top-right,
.Toastify__slide-enter--bottom-right {
  animation-name: Toastify__slideInRight;
}

.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}

.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--top-left,
.Toastify__slide-exit--bottom-left {
  animation-name: Toastify__slideOutLeft;
}

.Toastify__slide-exit--top-right,
.Toastify__slide-exit--bottom-right {
  animation-name: Toastify__slideOutRight;
}

.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
}

.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
}

.Toastify__toast-container {
  padding: var(--XR-gap);
}

.Toastify__toast {
  border-radius: var(--XR-borderRadius);
  font-family: inherit;
  padding: var(--XR-gap2);
  min-height: 0;
}

.Toastify__progress-bar {
  height: 2px;
}

.Toastify__close-button {
  display: none;
}

.Toastify__toast--success {
  background-color: var(--XR-color-success);
}

.Toastify__toast--error {
  background-color: var(--XR-color-error);
}

.Toastify__toast--success,
.Toastify__toast--error {
  color: white;
}

.Toastify__toast--success svg,
.Toastify__toast--error svg {
  fill: white;
}

html {
  --XR-gap: 4px;
  --XR-gapDefault: var(--XR-gap4);
  --XR-gap1: calc(1 * var(--XR-gap));
  --XR-gap2: calc(2 * var(--XR-gap));
  --XR-gap3: calc(3 * var(--XR-gap));
  --XR-gap4: calc(4 * var(--XR-gap));
  --XR-gap6: calc(6 * var(--XR-gap));
  --XR-gap8: calc(8 * var(--XR-gap));
  --XR-borderRadius: 6px;
  --XR-size-x-3: calc(var(--XR-size-x0) - var(--XR-gap3));
  --XR-size-x-2: calc(var(--XR-size-x0) - var(--XR-gap2));
  --XR-size-x-1: calc(var(--XR-size-x0) - var(--XR-gap1));
  --XR-size-x0: 40px;
  --XR-size-x1: calc(var(--XR-size-x0) + var(--XR-gap1));
  --XR-size-x2: calc(var(--XR-size-x0) + var(--XR-gap2));
  --XR-size-x3: calc(var(--XR-size-x0) + var(--XR-gap3));
  --XR-color-divider: rgba(127, 127, 127, 0.2);
  --XR-color-default: var(--XR-color-opacityLayer);
  --XR-color-default-hover: cyan;
  --XR-color-primary: rgb(45, 136, 255);
  --XR-color-primary-hover: rgba(75, 166, 255, 1);
  --XR-color-secondary: rgb(245, 0, 93);
  --XR-color-secondary-hover: rgb(255, 30, 123);
  --XR-color-success: rgba(26, 197, 103, 1);
  --XR-color-success-opacity: rgba(56, 227, 133, 0.15);
  --XR-color-success-hover: rgba(56, 227, 133, 1);
  --XR-color-error: rgba(239, 83, 80, 1);
  --XR-color-error-opacity: rgba(239, 83, 80, 0.15);
  --XR-color-error-hover: rgba(255, 113, 110, 1);
  --XR-color-warn: #ffb500;
  --XR-color-warn-opacity: rgba(255, 181, 0, 0.15);
  --XR-color-warn-hover: rgba(255, 181, 0, 1);
  --XR-color-opacityLayer: rgba(255, 255, 255, 0.05);
  --XR-Button-height: 40px;
  --XR-Button-borderRadius: 40px;
  --XR-Button-default-accent: var(--XR-color-textPrimary);
  --XR-Button-default-color: var(--XR-color-textPrimary);
  --XR-Button-default-filled-color: var(--XR-color-textPrimary);
  --XR-Button-primary-color: var(--XR-color-primary);
  --XR-Button-primary-filled-color: white;
  --XR-Button-secondary-color: var(--XR-color-secondary);
  --XR-Button-secondary-filled-color: white;
  --XR-Button-success-color: var(--XR-color-success);
  --XR-Button-success-filled-color: white;
  --XR-Button-error-color: var(--XR-color-error);
  --XR-Button-error-filled-color: black;
  --XR-Button-warn-color: var(--XR-color-warn);
  --XR-Button-warn-filled-color: black;
  --XR-Button-black-color: black;
  --XR-Button-black-filled-color: white;
  --XR-Button-white-color: white;
  --XR-Button-white-filled-color: black;
  --XR-Card-borderRadius: var(--XR-gap4);
  --XR-Input-height: var(--XR-Button-height);
  --XR-Input-fontSize: var(--XR-fontSize);
  --XR-Input-borderRadius: var(--XR-borderRadius);
  --XR-Section-padding: var(--XR-gap4);
  --XR-SectionHeader-title-fontSize: var(--x-font-size-3);
  --XR-SectionHeader-title-fontWeight: 500;
  --XR-SectionHeader-button-gap: var(--XR-gap1);
  --XR-fontSize-4: calc((1 - (4 * 0.125)) * 1rem);
  --XR-fontSize-3: calc((1 - (3 * 0.125)) * 1rem);
  --XR-fontSize-2: calc((1 - (2 * 0.125)) * 1rem);
  --XR-fontSize-1: calc((1 - (1 * 0.125)) * 1rem);
  --XR-fontSize: var(--XR-config-fontSize);
  --XR-fontSize1: calc((1 + (1 * 0.125)) * 1rem);
  --XR-fontSize2: calc((1 + (2 * 0.125)) * 1rem);
  --XR-fontSize3: calc((1 + (3 * 0.125)) * 1rem);
  --XR-fontSize4: calc((1 + (4 * 0.125)) * 1rem);
  --XR-fontSize5: calc((1 + (6 * 0.125)) * 1rem);
  --XR-fontSize6: calc((1 + (8 * 0.125)) * 1rem);
  --XR-Touchable-primary-backgroundColor: rgba(45, 136, 255, 1);
  --XR-Touchable-primary-backgroundColor-hover: rgba(45, 136, 255, 0.75);
  --XR-Touchable-primary-backgroundColor-hover-light: rgba(45, 136, 255, 0.25);
  --XR-Touchable-primary-filled-backgroundColor-hover: #61a5ff;
  --XR-Touchable-primary-borderColor: var(--XR-color-primary);
  --XR-Touchable-secondary-backgroundColor: var(--XR-color-secondary);
  --XR-Touchable-secondary-backgroundColor-hover: rgba(245, 0, 93, 0.75);
  --XR-Touchable-secondary-backgroundColor-hover-light: rgba(245, 0, 93, 0.25);
  --XR-Touchable-secondary-filled-backgroundColor-hover: #ff3883;
  --XR-Touchable-secondary-borderColor: var(--XR-color-secondary);
  --XR-Touchable-success-backgroundColor: var(--XR-color-success);
  --XR-Touchable-success-backgroundColor-hover: rgba(26, 197, 103, 0.75);
  --XR-Touchable-success-backgroundColor-hover-light: rgba(56, 227, 133, 0.25);
  --XR-Touchable-success-filled-backgroundColor-hover: #40e58b;
  --XR-Touchable-success-borderColor: var(--XR-color-success);
  --XR-Touchable-error-backgroundColor: var(--XR-color-error);
  --XR-Touchable-error-backgroundColor-hover: rgba(239, 83, 80, 0.75);
  --XR-Touchable-error-backgroundColor-hover-light: rgba(239, 83, 80, 0.25);
  --XR-Touchable-error-filled-backgroundColor-hover: #f37e7b;
  --XR-Touchable-error-borderColor: var(--XR-color-error);
  --XR-Touchable-warn-backgroundColor: var(--XR-color-warn);
  --XR-Touchable-warn-backgroundColor-hover: rgba(255, 181, 0, 0.75);
  --XR-Touchable-warn-backgroundColor-hover-light: rgba(255, 181, 0, 0.25);
  --XR-Touchable-warn-filled-backgroundColor-hover: #ffc73f;
  --XR-Touchable-warn-borderColor: var(--XR-color-warn);
  --XR-Touchable-black-backgroundColor: black;
  --XR-Touchable-black-backgroundColor-hover: black;
  --XR-Touchable-black-backgroundColor-hover-light: rgba(0, 0, 0, 0.1);
  --XR-Touchable-black-borderColor: black;
  --XR-Touchable-white-backgroundColor: white;
  --XR-Touchable-white-backgroundColor-hover: white;
  --XR-Touchable-white-backgroundColor-hover-light: rgba(255, 255, 255, 0.1);
  --XR-Touchable-white-borderColor: white;
  --XR-Touchable-default-borderColor: var(--XR-color-divider);
}

html[theme=dark] {
  --XR-Body-backgroundColor: #000;
  --XR-Card-backgroundColor: #1c1c1e;
  --XR-Card-boxShadow: 0 2px 8px rgb(15, 15, 15);
  --XR-Input-backgroundColor: rgba(255, 255, 255, 0.05);
  --XR-color-textPrimary: #ffffff;
  --XR-color-textSecondary: #99989e;
  --XR-color-opacityLayer: rgba(127, 127, 127, 0.2);
  --XR-Touchable-default-backgroundColor: rgba(127, 127, 127, 0.2);
  --XR-Touchable-default-backgroundColor-hover: rgba(127, 127, 127, 0.3);
  --XR-Touchable-default-backgroundColor-hover-light: rgba(127, 127, 127, 0.2);
  --XR-Touchable-default-filled-backgroundColor-hover: rgba(127, 127, 127, 0.3);
}

html[theme=light] {
  --XR-Body-backgroundColor: #f9f9f9;
  --XR-Card-backgroundColor: white;
  --XR-Card-boxShadow: rgba(0, 0, 0, 0.1) 0px 2px 8px;
  --XR-Input-backgroundColor: rgba(0, 0, 0, 0.05);
  --XR-color-textPrimary: rgb(32, 34, 35);
  --XR-color-textSecondary: #717171;
  --XR-color-opacityLayer: rgba(127, 127, 127, 0.1);
  --XR-Touchable-default-backgroundColor: rgba(127, 127, 127, 0.1);
  --XR-Touchable-default-backgroundColor-hover: rgba(127, 127, 127, 0.25);
  --XR-Touchable-default-backgroundColor-hover-light: rgba(127, 127, 127, 0.1);
  --XR-Touchable-default-filled-backgroundColor-hover: rgba(127, 127, 127, 0.3);
}

html {
  font-size: var(--XR-fontSize);
}

a {
  text-decoration: none;
}

@media (any-hover: hover) {
  ::-webkit-scrollbar {
    height: 6px;
    width: 6px;
    background-color: rgba(127, 127, 127, 0.1);
    border-radius: var(--XR-borderRadius);
  }
  ::-webkit-scrollbar-thumb {
    background-color: rgba(127, 127, 127, 0.5);
    border-radius: var(--XR-borderRadius);
  }
}
@media (hover: none) and (pointer: coarse) {
  html {
    --XR-Button-height: 44px;
    --XR-Section-padding: var(--XR-gap3);
  }
  ::-webkit-scrollbar {
    display: none;
  }
}
.XR-useDialog.overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: grid;
  align-content: center;
  padding: var(--XR-Section-padding);
}

.XR-useDialog.container {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  max-width: var(--XDialog-size-default-max-width);
  max-height: 100%;
  width: 100%;
  overflow: hidden;
}

.XR-useDialog.container.SMALL {
  max-width: var(--XDialog-size-small-max-width);
}

.XR-useDialog.container > .dialog-content-container {
  overflow: auto;
}

@media (max-width: 767px) {
  .XR-useDialog.overlay {
    display: flex;
    padding: 0;
  }
  .XR-useDialog.overlay .XR-useDialog.container {
    background-color: var(--XR-Card-backgroundColor);
    border-radius: 0;
    height: 100%;
  }
  .XR-useDialog.overlay .XR-useDialog.container > .dialog-content-container {
    flex: 1;
  }
}
.XR-useForm {
  --XR-useForm-gap: var(--x-section-gap);
}

.XR-useForm.type-boolean {
  justify-content: flex-start;
  height: var(--XR-size-x0);
}

.XR-useForm.type-boolean i {
  width: var(--XR-size-x0);
}

.XR-useForm.type-boolean.variant-toggle {
  justify-content: space-between;
}

.XR-useForm.type-boolean.variant-toggle i {
  color: var(--XR-color-textSecondary);
  font-size: 40px;
}

.XR-useForm.type-boolean.variant-checkbox {
  border-color: var(--XR-color-success);
}

.XR-useForm.type-boolean.variant-checkbox i {
  border-right: 1px solid var(--XR-color-divider);
  font-size: 24px;
}

.XR-useForm.type-boolean.variant-toggle.isActive i, .XR-useForm.type-boolean.variant-checkbox.isActive i {
  color: var(--XR-color-success);
}

.XR-useForm.disabled {
  opacity: 0.5;
}

.XR-useForm .medium-editor-element {
  min-height: var(--XR-Input-height);
  padding: 0 var(--XR-useForm-gap);
  width: 100%;
}

.XR-useForm .medium-editor-element:after {
  top: 50%;
  transform: translateY(-50%);
}

.XR-useForm.type-select.select-toggle-button,
.XR-useForm .type-select.select-toggle-button {
  padding-left: var(--XR-gap4);
  position: relative;
}

.XR-useForm.type-select.select-toggle-button, .XR-useForm.type-select.select-item,
.XR-useForm .type-select.select-toggle-button,
.XR-useForm .type-select.select-item {
  display: flex;
  justify-content: space-between;
  padding-right: 0;
  min-height: var(--XR-Input-height);
}

.XR-useForm.type-select .select-item i,
.XR-useForm .type-select .select-item i {
  font-size: 24px;
  width: var(--XR-size-x0);
}

.XR-useForm.type-select .placeholder,
.XR-useForm .type-select .placeholder {
  color: var(--XR-color-textSecondary);
}

.XR-useForm.type-select .input-button-icon,
.XR-useForm .type-select .input-button-icon {
  border-left: 1px solid var(--x-color-layer);
  border-radius: 0;
}

.XR-useForm.input-container {
  background-color: var(--XR-Input-backgroundColor);
}

.XR-useForm.input-container {
  position: relative;
  display: flex;
  min-height: var(--XR-Input-height);
  color: var(--XR-color-textPrimary);
  font-size: var(--XR-Input-fontSize);
  border-radius: var(--XR-Input-borderRadius);
}

.XR-useForm.input-container .icon {
  background-color: transparent;
  color: var(--XR-color-textSecondary);
}

.XR-useForm.input-container textarea,
.XR-useForm.input-container input {
  flex: 1;
  width: 0;
  min-width: 120px;
  height: inherit;
  min-height: inherit;
  border: 0;
  background-color: transparent;
  border-radius: inherit;
  color: inherit;
  font-size: inherit;
}

.XR-useForm.input-container textarea:first-child,
.XR-useForm.input-container input:first-child {
  padding-left: var(--XR-useForm-gap);
}

.XR-useForm.input-container textarea:focus,
.XR-useForm.input-container input:focus {
  outline: none;
}

.XR-useForm.input-container textarea {
  padding: calc(var(--x-font-size-0) / 2 + 2px) 0;
}

.XR-useForm .floating-label {
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(var(--XR-useForm-gap), -50%);
  padding: 0 var(--x-gap);
  border-radius: 40px;
  font-size: var(--x-font-size--3);
  font-weight: bold;
  background-color: var(--XCard-background-color);
}

.medium-editor-toolbar {
  background: var(--XR-Card-backgroundColor);
  box-shadow: var(--XR-Card-boxShadow);
  border: none;
  border-radius: var(--XR-Card-borderRadius);
  overflow: hidden;
}

.medium-editor-toolbar .medium-editor-action {
  background: var(--XR-Card-backgroundColor);
  border: none;
}

.medium-editor-toolbar .medium-editor-action:hover {
  background: var(--x-color-washed-hover);
  color: var(--XR-color-textPrimary);
}

.medium-editor-toolbar .medium-editor-button-active {
  background: var(--XR-color-success) !important;
}

.XR-useInput {
  position: relative;
}

.XR-useInput label {
  display: block;
}

.XR-useInput .input-container {
  display: flex;
  align-items: center;
  height: var(--XR-Input-height);
  width: 100%;
  background-color: var(--XR-color-opacityLayer);
  border-radius: var(--XR-borderRadius);
  padding-left: var(--XR-gap2);
  position: relative;
}

.XR-useInput .loader {
  position: absolute;
  top: 50%;
  left: 50%;
}

.XR-useInput input {
  flex: 1;
  border: 0;
  height: inherit;
  background-color: transparent;
  color: var(--XR-color-textPrimary);
}

.XR-useInput input:focus {
  outline: none;
}

.XR-useInput input[disabled] {
  opacity: 0.5;
}

.XR-useInput .label {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transform: translate(0, -50%);
  font-size: var(--XR-fontSize-2);
  font-weight: bold;
  letter-spacing: 0.5px;
  background-color: var(--XR-Card-backgroundColor);
  border-bottom-right-radius: var(--XR-borderRadius);
  padding: 0 8px;
}

.XR-useInput .helper,
.XR-useInput .error {
  color: var(--XR-color-textSecondary);
  font-weight: 700;
  font-size: var(--XR-fontSize-1);
}

.XR-useInput .error {
  color: var(--XR-color-error);
}

.XR-useList {
  --XR-useList-gap: var(--XR-gap4);
}

.XR-useList a {
  color: var(--XR-color-textPrimary);
}

.XR-useList > .title {
  padding: 0 var(--XR-gap2) var(--XR-gap2);
  color: var(--XR-color-textSecondary);
}

.XR-useList .items-container > :first-child,
.XR-useList .items-container > :first-child .item-container {
  border-top-left-radius: var(--XR-Card-borderRadius);
  border-top-right-radius: var(--XR-Card-borderRadius);
}

.XR-useList .items-container > :last-child,
.XR-useList .items-container > :last-child .item-container {
  border-bottom-left-radius: var(--XR-Card-borderRadius);
  border-bottom-right-radius: var(--XR-Card-borderRadius);
}

.XR-useList .items-container > :not(:first-child),
.XR-useList .items-container > :not(:first-child) .item-container {
  border-top: 1px solid var(--XR-color-divider);
}

.XR-useList .item-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--XR-size-x0);
  position: relative;
}

.XR-useList .item-container .loader {
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.XR-useList .item-container .loader .XLoader:before {
  border-top-color: white;
}

.XR-useList .item-container .left {
  display: inline-grid;
  grid-auto-flow: column;
  align-items: center;
  grid-gap: var(--XR-useList-gap);
  padding: var(--XR-gap3) var(--XR-useList-gap);
}

.XR-useList .item-container .left .subtitle {
  color: var(--XR-color-textSecondary);
  font-size: var(--XR-fontSize-1);
}

.XR-useList .item-container .right {
  padding-right: var(--XR-useList-gap);
}

.XR-useList .switch-container {
  padding: var(--XR-gap2) 0;
}

.XR-useList .switch-container .switch {
  position: relative;
  display: inline-block;
  width: 51px;
  height: 31px;
}

.XR-useList .switch-container .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.XR-useList .switch-container .switch input:checked + .slider {
  background-color: var(--x-color-success);
}

.XR-useList .switch-container .switch input:focus + .slider {
  box-shadow: 0 0 1px var(--x-color-success);
}

.XR-useList .switch-container .switch input:checked + .slider:before {
  transform: translateX(20px);
}

.XR-useList .switch-container .switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--x-color-layer);
  transition: 0.2s;
  border-radius: 34px;
}

.XR-useList .switch-container .switch .slider:before {
  position: absolute;
  content: "";
  height: 27px;
  width: 27px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  transition: 0.2s;
  border-radius: 50%;
}

.XR-Box.p-1 {
  padding: calc(1 * var(--XR-gap));
}

.XR-Box.p-2 {
  padding: calc(2 * var(--XR-gap));
}

.XR-Box.p-3 {
  padding: calc(3 * var(--XR-gap));
}

.XR-Box.p-4 {
  padding: calc(4 * var(--XR-gap));
}

.XR-Box.p-5 {
  padding: calc(5 * var(--XR-gap));
}

.XR-Box.p-6 {
  padding: calc(6 * var(--XR-gap));
}

.XR-Box.p-7 {
  padding: calc(7 * var(--XR-gap));
}

.XR-Box.p-8 {
  padding: calc(8 * var(--XR-gap));
}

.XR-Box.p-9 {
  padding: calc(9 * var(--XR-gap));
}

.XR-Box.p-10 {
  padding: calc(10 * var(--XR-gap));
}

.XR-Box.p-11 {
  padding: calc(11 * var(--XR-gap));
}

.XR-Box.p-12 {
  padding: calc(12 * var(--XR-gap));
}

.XR-Box.flex {
  display: flex;
}

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

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

.XR-Box.flex.ai-start {
  align-items: flex-start;
}

.XR-Box.flex.ai-center {
  align-items: center;
}

.XR-Box.flex.ai-end {
  align-items: flex-end;
}

.XR-Box.flex.jc-start {
  justify-content: flex-start;
}

.XR-Box.flex.jc-center {
  justify-content: center;
}

.XR-Box.flex.jc-end {
  justify-content: flex-end;
}

.XR-Box.flex.jc-spaceBetween {
  justify-content: space-between;
}

.XR-Box.flex.fd-row {
  flex-direction: row;
}

.XR-Box.flex.fd-column {
  flex-direction: column;
}

.XR-Box.flex.g-1 > *:not(:last-child) {
  margin-right: calc(1 * var(--XR-gap));
}

.XR-Box.flex.g-2 > *:not(:last-child) {
  margin-right: calc(2 * var(--XR-gap));
}

.XR-Box.flex.g-3 > *:not(:last-child) {
  margin-right: calc(3 * var(--XR-gap));
}

.XR-Box.flex.g-4 > *:not(:last-child) {
  margin-right: calc(4 * var(--XR-gap));
}

.XR-Box.flex.g-5 > *:not(:last-child) {
  margin-right: calc(5 * var(--XR-gap));
}

.XR-Box.flex.g-6 > *:not(:last-child) {
  margin-right: calc(6 * var(--XR-gap));
}

.XR-Box.flex.g-7 > *:not(:last-child) {
  margin-right: calc(7 * var(--XR-gap));
}

.XR-Box.flex.g-8 > *:not(:last-child) {
  margin-right: calc(8 * var(--XR-gap));
}

.XR-Box.flex.g-9 > *:not(:last-child) {
  margin-right: calc(9 * var(--XR-gap));
}

.XR-Box.flex.g-10 > *:not(:last-child) {
  margin-right: calc(10 * var(--XR-gap));
}

.XR-Box.flex.g-11 > *:not(:last-child) {
  margin-right: calc(11 * var(--XR-gap));
}

.XR-Box.flex.g-12 > *:not(:last-child) {
  margin-right: calc(12 * var(--XR-gap));
}

.XR-Box.grid {
  display: grid;
}

.XR-Box.grid.g-true {
  grid-gap: var(--XR-Section-padding);
}

.XR-Box.grid.g-1 {
  grid-gap: calc(1 * var(--XR-gap));
}

.XR-Box.grid.g-2 {
  grid-gap: calc(2 * var(--XR-gap));
}

.XR-Box.grid.g-3 {
  grid-gap: calc(3 * var(--XR-gap));
}

.XR-Box.grid.g-4 {
  grid-gap: calc(4 * var(--XR-gap));
}

.XR-Box.grid.g-5 {
  grid-gap: calc(5 * var(--XR-gap));
}

.XR-Box.grid.g-6 {
  grid-gap: calc(6 * var(--XR-gap));
}

.XR-Box.grid.g-7 {
  grid-gap: calc(7 * var(--XR-gap));
}

.XR-Box.grid.g-8 {
  grid-gap: calc(8 * var(--XR-gap));
}

.XR-Box.grid.g-9 {
  grid-gap: calc(9 * var(--XR-gap));
}

.XR-Box.grid.g-10 {
  grid-gap: calc(10 * var(--XR-gap));
}

.XR-Box.grid.g-11 {
  grid-gap: calc(11 * var(--XR-gap));
}

.XR-Box.grid.g-12 {
  grid-gap: calc(12 * var(--XR-gap));
}

.XR-Box.round {
  border-radius: var(--XR-borderRadius);
}

.XR-Box.fullHeight {
  height: 100%;
}

.XR-Box.fullWidth {
  width: 100%;
}

@media print {
  .XR-Box.hidePrint {
    display: none;
  }
}
.XR-Box.o-auto {
  overflow: auto;
}

.XR-Box.o-hidden {
  overflow: hidden;
}

.XR-Box.ws-nowrap {
  white-space: nowrap;
}

.XR-Box.flexChildren > * {
  flex: 1;
}

.XR-Button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-left: var(--XR-gap4);
  padding-right: var(--XR-gap4);
  min-height: var(--XR-Button-height);
  background-color: transparent;
  border-radius: var(--XR-Button-borderRadius);
  border: 0;
  box-shadow: none;
  color: inherit;
  font-weight: 500;
  white-space: nowrap;
  text-decoration: none;
}

.XR-Button .icon-start {
  margin-right: var(--XR-gap2);
}

.XR-Button .icon-end {
  margin-left: var(--XR-gap2);
}

.XR-Button .icon-placeholder {
  width: var(--XR-gap2);
}

.XR-Button.iconOnly {
  height: var(--XR-Button-height);
  width: var(--XR-Button-height);
  min-width: var(--XR-Button-height);
  padding: 0;
}

.XR-Button.iconOnly .icon-start,
.XR-Button.iconOnly .icon-end {
  margin: 0;
}

.XR-Button:not(.iconOnly).iconStart {
  padding-left: var(--XR-gap3);
}

.XR-Button:not(.iconOnly).iconEnd {
  padding-right: var(--XR-gap3);
}

.XR-Button[disabled] {
  cursor: auto;
  opacity: 0.5;
}

.XR-Button.outlined-default {
  color: var(--XR-Button-default-color);
}

.XR-Button.filled-default {
  color: var(--XR-Button-default-filled-color);
}

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

.XR-Button.outlined-primary {
  color: var(--XR-Button-primary-color);
}

.XR-Button.filled-primary {
  color: var(--XR-Button-primary-filled-color);
}

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

.XR-Button.outlined-secondary {
  color: var(--XR-Button-secondary-color);
}

.XR-Button.filled-secondary {
  color: var(--XR-Button-secondary-filled-color);
}

.XR-Button.text-success {
  color: var(--XR-Button-success-color);
}

.XR-Button.outlined-success {
  color: var(--XR-Button-success-color);
}

.XR-Button.filled-success {
  color: var(--XR-Button-success-filled-color);
}

.XR-Button.text-error {
  color: var(--XR-Button-error-color);
}

.XR-Button.outlined-error {
  color: var(--XR-Button-error-color);
}

.XR-Button.filled-error {
  color: var(--XR-Button-error-filled-color);
}

.XR-Button.text-warn {
  color: var(--XR-Button-warn-color);
}

.XR-Button.outlined-warn {
  color: var(--XR-Button-warn-color);
}

.XR-Button.filled-warn {
  color: var(--XR-Button-warn-filled-color);
}

.XR-Button.text-black {
  color: var(--XR-Button-black-color);
}

.XR-Button.outlined-black {
  color: var(--XR-Button-black-color);
}

.XR-Button.filled-black {
  color: var(--XR-Button-black-filled-color);
}

.XR-Button.text-white {
  color: var(--XR-Button-white-color);
}

.XR-Button.outlined-white {
  color: var(--XR-Button-white-color);
}

.XR-Button.filled-white {
  color: var(--XR-Button-white-filled-color);
}

.XR-Button.fullWidth {
  width: 100%;
}

.XR-Button .loader {
  position: absolute;
}

.XR-Card {
  background-color: var(--XR-Card-backgroundColor);
  box-shadow: var(--XR-Card-boxShadow);
  border-radius: var(--XR-Card-borderRadius);
}

html[theme=dark] .XR-Card .XR-Card {
  background-color: var(--XR-color-opacityLayer);
}

.XR-LayoutContent {
  margin: 0 auto;
  margin-top: var(--XR-LayoutHeader-height);
  transition: padding-left 200ms;
}

@media print {
  .XR-LayoutContent {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
  }
}
html {
  --XR-LayoutHeader-zIndex: 100;
  --XR-LayoutHeader-height: 56px;
  --XR-LayoutHeader-backgroundColor: var(--XR-Card-backgroundColor);
}

.XR-LayoutHeader {
  position: fixed;
  top: 0;
  left: 0;
  background-color: var(--XR-LayoutHeader-backgroundColor);
  width: 100%;
  height: var(--XR-LayoutHeader-height);
  z-index: var(--XR-LayoutHeader-zIndex);
  display: flex;
  transition: padding-left 200ms;
}

.XR-LayoutHeader > .content {
  flex: 1;
}

@media print {
  .XR-LayoutHeader {
    display: none !important;
  }
}
html {
  --XR-LayoutSidebar-zIndex: calc(var(--XR-LayoutHeader-zIndex) + 1);
  --XR-LayoutSidebar-width: 240px;
  --XR-LayoutSidebar-backgroundColor: var(--XR-Card-backgroundColor);
}

.XR-LayoutSidebar,
.XR-LayoutSidebar-overlay {
  position: fixed;
  z-index: var(--XR-LayoutSidebar-zIndex);
  top: 0;
  left: 0;
  height: 100%;
}

.XR-LayoutSidebar {
  background-color: var(--XR-LayoutSidebar-backgroundColor);
  overflow: auto;
  transition: transform 200ms;
}

.XR-LayoutSidebar.toggle {
  margin: 0 auto;
}

@media (max-width: 1180px) {
  .XR-LayoutSidebar {
    margin: 0 auto;
  }
}
.XR-LayoutSidebar.isOpen {
  transform: translateX(0);
}

@media print {
  .XR-LayoutSidebar {
    display: none !important;
  }
}
@media (max-width: 1180px) {
  .XR-LayoutSidebar-overlay.isOpen {
    width: 100%;
    animation: XR-Overlay-animateIn 200ms forwards;
    background-color: var(--x-color-overlay);
  }
}
.XR-LayoutSidebarToggle.XR-Button {
  height: 100%;
  min-width: var(--XR-LayoutHeader-height);
  border-radius: 0;
}

@media (min-width: 1181px) {
  .XR-LayoutSidebarToggle.XR-Button.auto {
    display: none;
  }
}
.XR-Overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--XOverlay-z-index);
  overflow: auto;
  animation: XR-Overlay-animateIn 200ms forwards;
  background-color: var(--x-color-overlay);
}

.XR-Overlay.z0 {
  z-index: calc(var(--XOverlay-z-index) + 0);
}

.XR-Overlay.z1 {
  z-index: calc(var(--XOverlay-z-index) + 1);
}

.XR-Overlay.z2 {
  z-index: calc(var(--XOverlay-z-index) + 2);
}

.XR-Overlay.z3 {
  z-index: calc(var(--XOverlay-z-index) + 3);
}

.XR-Overlay.z4 {
  z-index: calc(var(--XOverlay-z-index) + 4);
}

.XR-Overlay.z5 {
  z-index: calc(var(--XOverlay-z-index) + 5);
}

.XR-Overlay.z6 {
  z-index: calc(var(--XOverlay-z-index) + 6);
}

.XR-Overlay.z7 {
  z-index: calc(var(--XOverlay-z-index) + 7);
}

.XR-Overlay.z8 {
  z-index: calc(var(--XOverlay-z-index) + 8);
}

.XR-Overlay.z9 {
  z-index: calc(var(--XOverlay-z-index) + 9);
}

.XR-Overlay.z10 {
  z-index: calc(var(--XOverlay-z-index) + 10);
}

@keyframes XR-Overlay-animateIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.XR-Section {
  padding: var(--XR-Section-padding);
}

.XR-Section:not(:last-child) {
  padding-bottom: calc(var(--XR-Section-padding) / 2);
}

.XR-Section:not(:first-child) {
  padding-top: calc(var(--XR-Section-padding) / 2);
}

.XR-Section.fullWidth {
  padding-left: 0;
  padding-right: 0;
}

.XR-SectionHeader .action-row {
  display: flex;
  justify-content: space-between;
}

.XR-SectionHeader .buttons {
  grid-gap: var(--XR-SectionHeader-button-gap);
  overflow: auto;
}

.XR-SectionHeader .buttons,
.XR-SectionHeader .title,
.XR-SectionHeader .title-content {
  display: inline-grid;
  grid-auto-flow: column;
  align-items: center;
}

.XR-SectionHeader .title,
.XR-SectionHeader .title-content {
  grid-gap: var(--XR-gap2);
}

.XR-SectionHeader .title {
  grid-gap: var(--XR-gap2);
  min-height: var(--XR-size-x0);
  display: flex;
  justify-content: space-between;
}

.XR-SectionHeader .title .title-content {
  display: flex;
  align-items: center;
  font-size: var(--XR-SectionHeader-title-fontSize);
  font-weight: var(--XR-SectionHeader-title-fontWeight);
}

.XR-SectionHeader .title .title-content .iconOnly {
  min-width: 24px;
  width: 24px;
}

.XR-SectionHeader .title .subtitle {
  color: var(--XR-color-textSecondary);
}

.XR-Touchable {
  cursor: pointer;
  touch-action: manipulation;
  user-select: none;
  transition: 200ms;
}

.XR-Touchable.text-default {
  background-color: transparent;
}

.XR-Touchable.text-default:hover {
  background-color: var(--XR-Touchable-default-backgroundColor-hover-light);
}

.XR-Touchable.filled-default {
  background-color: var(--XR-Touchable-default-backgroundColor);
}

.XR-Touchable.filled-default:hover {
  background-color: var(--XR-Touchable-default-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-default {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-default-borderColor);
}

.XR-Touchable.outlined-default:hover {
  background-color: var(--XR-Touchable-default-backgroundColor-hover-light);
}

.XR-Touchable.text-primary {
  background-color: transparent;
}

.XR-Touchable.text-primary:hover {
  background-color: var(--XR-Touchable-primary-backgroundColor-hover-light);
}

.XR-Touchable.filled-primary {
  background-color: var(--XR-Touchable-primary-backgroundColor);
}

.XR-Touchable.filled-primary:hover {
  background-color: var(--XR-Touchable-primary-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-primary {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-primary-borderColor);
}

.XR-Touchable.outlined-primary:hover {
  background-color: var(--XR-Touchable-primary-backgroundColor-hover-light);
}

.XR-Touchable.text-secondary {
  background-color: transparent;
}

.XR-Touchable.text-secondary:hover {
  background-color: var(--XR-Touchable-secondary-backgroundColor-hover-light);
}

.XR-Touchable.filled-secondary {
  background-color: var(--XR-Touchable-secondary-backgroundColor);
}

.XR-Touchable.filled-secondary:hover {
  background-color: var(--XR-Touchable-secondary-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-secondary {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-secondary-borderColor);
}

.XR-Touchable.outlined-secondary:hover {
  background-color: var(--XR-Touchable-secondary-backgroundColor-hover-light);
}

.XR-Touchable.text-success {
  background-color: transparent;
}

.XR-Touchable.text-success:hover {
  background-color: var(--XR-Touchable-success-backgroundColor-hover-light);
}

.XR-Touchable.filled-success {
  background-color: var(--XR-Touchable-success-backgroundColor);
}

.XR-Touchable.filled-success:hover {
  background-color: var(--XR-Touchable-success-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-success {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-success-borderColor);
}

.XR-Touchable.outlined-success:hover {
  background-color: var(--XR-Touchable-success-backgroundColor-hover-light);
}

.XR-Touchable.text-error {
  background-color: transparent;
}

.XR-Touchable.text-error:hover {
  background-color: var(--XR-Touchable-error-backgroundColor-hover-light);
}

.XR-Touchable.filled-error {
  background-color: var(--XR-Touchable-error-backgroundColor);
}

.XR-Touchable.filled-error:hover {
  background-color: var(--XR-Touchable-error-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-error {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-error-borderColor);
}

.XR-Touchable.outlined-error:hover {
  background-color: var(--XR-Touchable-error-backgroundColor-hover-light);
}

.XR-Touchable.text-warn {
  background-color: transparent;
}

.XR-Touchable.text-warn:hover {
  background-color: var(--XR-Touchable-warn-backgroundColor-hover-light);
}

.XR-Touchable.filled-warn {
  background-color: var(--XR-Touchable-warn-backgroundColor);
}

.XR-Touchable.filled-warn:hover {
  background-color: var(--XR-Touchable-warn-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-warn {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-warn-borderColor);
}

.XR-Touchable.outlined-warn:hover {
  background-color: var(--XR-Touchable-warn-backgroundColor-hover-light);
}

.XR-Touchable.text-black {
  background-color: transparent;
}

.XR-Touchable.text-black:hover {
  background-color: var(--XR-Touchable-black-backgroundColor-hover-light);
}

.XR-Touchable.filled-black {
  background-color: var(--XR-Touchable-black-backgroundColor);
}

.XR-Touchable.filled-black:hover {
  background-color: var(--XR-Touchable-black-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-black {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-black-borderColor);
}

.XR-Touchable.outlined-black:hover {
  background-color: var(--XR-Touchable-black-backgroundColor-hover-light);
}

.XR-Touchable.text-white {
  background-color: transparent;
}

.XR-Touchable.text-white:hover {
  background-color: var(--XR-Touchable-white-backgroundColor-hover-light);
}

.XR-Touchable.filled-white {
  background-color: var(--XR-Touchable-white-backgroundColor);
}

.XR-Touchable.filled-white:hover {
  background-color: var(--XR-Touchable-white-filled-backgroundColor-hover);
}

.XR-Touchable.outlined-white {
  background-color: transparent;
  border: 1px solid var(--XR-Touchable-white-borderColor);
}

.XR-Touchable.outlined-white:hover {
  background-color: var(--XR-Touchable-white-backgroundColor-hover-light);
}


html {
  --XInput-font-size: 1rem;
  --XInput-height: 44px;
  --XButton-font-size: 1rem;
  --XButton-height: 44px;
}

html[theme=dark] {
  --ui-color-body: var(--x-color-body);
}

html.XS[color-scheme=dark],
html.XS[color-scheme=light] {
  background-color: var(--color-root);
  color: var(--color-text);
}

html a {
  color: var(--color-text);
  text-decoration: none;
}

html,
body,
#root {
  height: 100%;
}

input {
  padding: 0;
}

html.dialog-open,
html.dialog-open body {
  overflow: hidden;
  position: relative;
}

.cta {
  letter-spacing: 1px;
  text-transform: uppercase;
}

.hide-overflow {
  overflow: hidden;
}

img {
  max-height: 100%;
}

input,
optgroup,
select,
textarea {
  font-size: inherit;
}

@keyframes AnimationBoxAnimation {
  100% {
    transform: rotate(1turn);
  }
}._slot_1cxkh_1 {
    display: grid !important;
    grid-template-rows: 1fr;
    margin-bottom: 6px;
    transition:
        grid-template-rows 300ms cubic-bezier(0.4, 0, 1, 1),
        margin-bottom 300ms cubic-bezier(0.4, 0, 1, 1);
}

._slotExiting_1cxkh_10 {
    grid-template-rows: 0fr;
    margin-bottom: 0;
}

._slotInner_1cxkh_15 {
    overflow: clip;
    overflow-clip-margin: 20px;
    min-height: 0;
}

._card_1cxkh_21 {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

._entering_1cxkh_25 {
    animation: _toastEnter_1cxkh_1 300ms cubic-bezier(0.1, 0.7, 0.1, 1);
}

._exiting_1cxkh_29 {
    animation: _toastSlideOut_1cxkh_1 300ms cubic-bezier(0.4, 0, 1, 1) forwards;
}

._colorSuccess_1cxkh_33._colorSuccess_1cxkh_33 {
    background: color-mix(in srgb, var(--color-success) 75%, transparent);
    color: white;
}

._colorDanger_1cxkh_38._colorDanger_1cxkh_38 {
    background: color-mix(in srgb, var(--color-danger) 75%, transparent);
    color: white;
}

@keyframes _toastEnter_1cxkh_1 {
    from {
        opacity: 0;
        transform: translateY(-100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes _toastSlideOut_1cxkh_1 {
    to {
        opacity: 0;
        transform: translateY(-100%);
    }
}
@layer component {
  @keyframes _heroParallax_ln1kf_1 {
    from {
      transform: translateY(0);
    }
    to {
      transform: translateY(80px);
    }
  }
  ._heroBg_ln1kf_10 {
    animation: _heroParallax_ln1kf_1 linear both;
    animation-timeline: view(block);
    animation-range: cover 0% exit 100%;
  }
}@layer component {
  ._AGBackdrop_ur9fv_2 {
    animation: _backdropEnter_ur9fv_1 300ms cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  @keyframes _backdropEnter_ur9fv_1 {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
}@layer component {
  ._root_1g95p_2 {
    --overlay-animation-duration: 300ms;
    box-sizing: border-box;
    background: transparent;
    color: inherit;
    border: 0;
    outline: none;
    margin: initial;
    padding: calc(env(safe-area-inset-top) + 6px) calc(env(safe-area-inset-right) + 6px) calc(env(safe-area-inset-bottom) + 6px) calc(env(safe-area-inset-left) + 6px);
  }
  ._gridPositionLeft_1g95p_12,
  ._drawer-position-left_1g95p_13 {
    justify-items: start;
    align-items: stretch;
  }
  ._gridPositionRight_1g95p_17,
  ._drawer-position-right_1g95p_18 {
    justify-items: end;
    align-items: stretch;
  }
  ._gridPositionTop_1g95p_22,
  ._drawer-position-top_1g95p_23 {
    justify-items: center;
    align-items: start;
  }
  ._gridPositionTopRight_1g95p_27,
  ._drawer-position-topRight_1g95p_28 {
    justify-items: end;
    align-items: start;
  }
  ._gridPositionBottom_1g95p_32,
  ._drawer-position-bottom_1g95p_33 {
    justify-items: center;
    align-items: end;
  }
  ._gridPositionCenter_1g95p_37,
  ._drawer-position-center_1g95p_38 {
    justify-items: center;
    align-items: center;
  }
  ._isDialog_1g95p_42 {
    animation: _dialogEnter_1g95p_1 var(--overlay-animation-duration) cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._isPopup_1g95p_45 {
    animation: _popupEnter_1g95p_1 var(--overlay-animation-duration) cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._popupIsMeasuring_1g95p_48 {
    opacity: 0;
    animation: none;
  }
  ._popupIsPositioned_1g95p_52 {
    transition: all cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._positionBottom_1g95p_55 {
    animation: _drawerBottomEnter_1g95p_1 var(--overlay-animation-duration) cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._positionBottomExit_1g95p_58 {
    animation: _drawerBottomExit_1g95p_1 var(--overlay-animation-duration) forwards;
  }
  ._positionTop_1g95p_61 {
    animation: _drawerTopEnter_1g95p_1 var(--overlay-animation-duration) cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._positionTopExit_1g95p_64 {
    animation: _drawerTopExit_1g95p_1 var(--overlay-animation-duration) forwards;
  }
  ._positionLeft_1g95p_67 {
    animation: _drawerLeftEnter_1g95p_1 var(--overlay-animation-duration) cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._positionLeftExit_1g95p_70 {
    animation: _drawerLeftExit_1g95p_1 var(--overlay-animation-duration) forwards;
  }
  ._positionRight_1g95p_73 {
    animation: _drawerRightEnter_1g95p_1 var(--overlay-animation-duration) cubic-bezier(0.1, 0.7, 0.1, 1);
  }
  ._positionRightExit_1g95p_76 {
    animation: _drawerRightExit_1g95p_1 var(--overlay-animation-duration) forwards;
  }
  ._positionCenterExit_1g95p_79 {
    animation: _dialogExit_1g95p_1 var(--overlay-animation-duration) forwards;
  }
  ._popupExit_1g95p_82 {
    animation: _popupExit_1g95p_82 var(--overlay-animation-duration) forwards;
  }
  @keyframes _dialogEnter_1g95p_1 {
    0% {
      opacity: 0;
      transform: scale(0.95) translateY(60px);
    }
    100% {
      opacity: 1;
      transform: scale(1) translateY(0);
    }
  }
  @keyframes _dialogExit_1g95p_1 {
    0% {
      opacity: 1;
      transform: scale(1) translateY(0);
    }
    100% {
      opacity: 0;
      transform: scale(0.95) translateY(60px);
    }
  }
  @keyframes _popupEnter_1g95p_1 {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  @keyframes _popupExit_1g95p_82 {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes _drawerBottomEnter_1g95p_1 {
    from {
      opacity: 0;
      transform: translateY(100%);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes _drawerBottomExit_1g95p_1 {
    from {
      opacity: 1;
      transform: translateY(0);
    }
    to {
      opacity: 0;
      transform: translateY(100%);
    }
  }
  @keyframes _drawerTopEnter_1g95p_1 {
    from {
      opacity: 0;
      transform: translateY(-100%);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes _drawerTopExit_1g95p_1 {
    from {
      opacity: 1;
      transform: translateY(0);
    }
    to {
      opacity: 0;
      transform: translateY(-100%);
    }
  }
  @keyframes _drawerLeftEnter_1g95p_1 {
    from {
      opacity: 0;
      transform: translateX(-100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  @keyframes _drawerLeftExit_1g95p_1 {
    from {
      opacity: 1;
      transform: translateX(0);
    }
    to {
      opacity: 0;
      transform: translateX(-100%);
    }
  }
  @keyframes _drawerRightEnter_1g95p_1 {
    from {
      opacity: 0;
      transform: translateX(100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  @keyframes _drawerRightExit_1g95p_1 {
    from {
      opacity: 1;
      transform: translateX(0);
    }
    to {
      opacity: 0;
      transform: translateX(100%);
    }
  }
  ._backdropExit_1g95p_201 {
    animation: _backdropExit_1g95p_201 var(--overlay-animation-duration) forwards;
  }
  @keyframes _backdropExit_1g95p_201 {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  ._isDrawer_1g95p_212._positionLeft_1g95p_67, ._isDrawer_1g95p_212._positionRight_1g95p_73 {
    height: 100%;
    max-height: 100%;
  }
}@keyframes _ripple-pulse_1l36t_1 {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  100% {
    transform: scale(1.08, 1.22);
    opacity: 0;
  }
}
@keyframes _shift-gradient_1l36t_1 {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-50%, 0, 0);
  }
}
._buttonContainer_1l36t_19 {
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2), 0 8px 20px -6px color-mix(in srgb, var(--agColorBrand) 22%, transparent), 0 8px 20px -6px color-mix(in srgb, var(--agColorRed) 22%, transparent);
}
._buttonContainer_1l36t_19:active {
  transform: scale(0.98);
}

._rippleEffect_1l36t_27 {
  border-radius: 9999px;
  background: color-mix(in srgb, var(--agColorBrand) 30%, var(--agColorRed) 30%);
  animation: _ripple-pulse_1l36t_1 6s infinite cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform, opacity;
  pointer-events: none;
}

._vibrantBgActive_1l36t_35 {
  will-change: transform;
}

._gradientSlide_1l36t_39 {
  background: linear-gradient(to right, var(--agColorBrand) 0%, var(--agColorRed) 50%, var(--agColorBrand) 100%);
  animation: _shift-gradient_1l36t_1 8s ease-in-out infinite alternate;
  will-change: transform;
}

._conicBorder_1l36t_45 {
  background: conic-gradient(from 0deg, var(--agColorBrand) 0deg, var(--agColorRed) 90deg, var(--agColorBrand) 180deg, var(--agColorRed) 270deg, var(--agColorBrand) 360deg);
  opacity: 0.8;
}@layer reset {
  .el-input input,
  .el-input textarea {
    all: unset;
    box-sizing: border-box;
    cursor: text;
    background: transparent;
    width: 100%;
  }
  .el-input input::placeholder,
  .el-input textarea::placeholder {
    color: var(--agColorSecondary);
    opacity: 0.7;
  }
}
@layer base {
  :root {
    --el-input-min-height: 44px;
    --el-input-padding-left: 12px;
    --el-input-padding-rest: 4px;
    --el-input-section-height: calc(var(--el-input-min-height) - 2 * var(--el-input-padding-rest));
    --el-input-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --el-input-border-radius: var(--agBorderRadiusMd);
    --el-input-border-width: 0px;
    --el-input-font-size: 14px;
  }
  .el-input {
    background: var(--el-input-background);
    min-height: var(--el-input-min-height);
    border-radius: var(--el-input-border-radius);
    border: var(--el-input-border-width, 0px) solid var(--agColorBorder);
    padding: var(--el-input-padding-rest);
    padding-left: var(--el-input-padding-left);
    padding-right: var(--el-input-padding-left);
    font-size: var(--el-input-font-size);
    flex-shrink: 0;
  }
  .el-input:not([data-el-read-only], [disabled])[data-el-input-type=boolean], .el-input:not([data-el-read-only], [disabled])[data-el-input-type^=date], .el-input:not([data-el-read-only], [disabled])[data-el-input-type=color], .el-input:not([data-el-read-only], [disabled])[data-el-input-type^=picker]:not([data-el-variant=segment]) {
    cursor: pointer;
  }
  .el-input[data-el-read-only] {
    cursor: default;
  }
  .el-input[data-el-read-only] *,
  .el-input[data-el-read-only] input,
  .el-input[data-el-read-only] textarea {
    cursor: default;
  }
  .el-input[data-el-read-only] input,
  .el-input[data-el-read-only] textarea {
    caret-color: transparent;
  }
  .el-input[data-el-read-only] .el-input-segment-button {
    cursor: default;
    pointer-events: none;
  }
  .el-input-left,
  .el-input-right {
    height: var(--el-input-section-height);
  }
  .el-input-center {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .el-input-label {
    font-size: var(--el-input-font-size);
    font-weight: 500;
    color: var(--agColorSecondary);
    transition: all 200ms;
    white-space: nowrap;
  }
  .el-input:not([data-el-input-type^=picker], [data-el-input-type^=date], [data-el-input-type=boolean], [data-el-input-type=color]) .el-input-label {
    max-height: 0;
  }
  .el-input[data-el-has-value]:not([data-el-input-type=boolean]) .el-input-label {
    max-height: 14px;
    font-size: 10px;
  }
  .el-input-switch-container {
    --container-width: 44px;
    --container-size: 24px;
    --gap: 2px;
    --toggle-size: calc(var(--container-size) - 2 * var(--gap));
    --color-toggle: white;
    --color-checked-background: var(--agColorBrand);
    --color-background: var(--agColorBorder, #ccc);
    flex-shrink: 0;
    position: relative;
    display: inline-block;
    width: var(--container-width);
    height: var(--container-size);
    cursor: pointer;
  }
  .el-input-switch-container[data-el-disabled] {
    cursor: not-allowed;
  }
  .el-input-switch-container[data-el-read-only] {
    cursor: default;
  }
  .el-input-switch {
    height: 100%;
    position: absolute;
    cursor: pointer;
    inset: 0;
    background-color: var(--color-background);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    border-radius: 34px;
  }
  [data-el-read-only] .el-input-switch {
    cursor: default;
  }
  [data-el-disabled] .el-input-switch {
    cursor: not-allowed;
  }
  .el-input-switch:before {
    position: absolute;
    content: "";
    height: var(--toggle-size);
    width: var(--toggle-size);
    left: var(--gap);
    bottom: var(--gap);
    background-color: var(--color-toggle);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  }
  .el-input-switch[data-el-active] {
    background-color: var(--color-checked-background);
  }
  .el-input-switch[data-el-active]:before {
    transform: translateX(calc(var(--container-width) - var(--toggle-size) - 2 * var(--gap)));
  }
  .el-input-checkbox {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--El-icon-size, 24px);
    height: var(--El-icon-size, 24px);
    line-height: 1;
    vertical-align: middle;
  }
  .el-input-checkbox[data-el-disabled] {
    cursor: not-allowed;
  }
  .el-input-checkbox[data-el-read-only] {
    cursor: default;
  }
  .el-input-checkbox [data-el-is=icon] {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
  }
  .el-input[data-el-input-type=boolean] {
    user-select: none;
    -webkit-user-select: none;
  }
  .el-input[data-el-input-type=boolean]:not([data-el-read-only], [disabled]) {
    cursor: pointer;
  }
  .el-input[data-el-input-type=boolean][data-el-read-only] {
    cursor: default;
  }
  .el-input[data-el-input-type=boolean][data-el-disabled] {
    cursor: not-allowed;
  }
  .el-input[data-el-input-type=boolean] .el-input-label {
    font-weight: 400;
    color: var(--agColorPrimary);
    white-space: normal;
  }
  .el-input[data-el-input-type=boolean] .el-input-subtitle {
    font-size: 12px;
    color: var(--agColorSecondary);
    white-space: normal;
    line-height: 1.3;
  }
  .el-input[data-el-input-type=boolean] .el-input-center {
    flex-direction: column;
    justify-content: center;
  }
  .el-input[data-el-input-type=boolean]:not([data-el-has-label], [data-el-has-subtitle]) {
    justify-content: center;
  }
  .el-input[data-el-input-type=boolean]:not([data-el-has-label], [data-el-has-subtitle]) .el-input-center {
    display: none;
  }
  .el-input[data-el-input-type=boolean]:not([data-el-has-label], [data-el-has-subtitle]) .el-input-left,
  .el-input[data-el-input-type=boolean]:not([data-el-has-label], [data-el-has-subtitle]) .el-input-right {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .el-input[data-el-variant=checkbox]:not([data-el-has-label], [data-el-has-subtitle]) {
    min-height: auto;
    padding: 0;
    justify-content: center;
    align-items: center;
  }
  .el-input[data-el-variant=checkbox]:not([data-el-has-label], [data-el-has-subtitle]) .el-input-center {
    display: none;
  }
  .el-input[data-el-variant=checkbox]:not([data-el-has-label], [data-el-has-subtitle]) .el-input-left,
  .el-input[data-el-variant=checkbox]:not([data-el-has-label], [data-el-has-subtitle]) .el-input-right {
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .el-input[data-el-variant=segment] {
    padding: 3px;
  }
  .el-input[data-el-variant=segment] .el-input-center {
    align-self: stretch;
  }
  .el-input[data-el-variant=segment] .el-input-segment-container {
    align-self: stretch;
    height: 100%;
  }
  .el-input[data-el-variant=segment] .el-input-segment-button {
    flex: 1 0 auto;
    min-width: max-content;
    height: 100%;
    min-height: 0;
    border-radius: var(--agBorderRadiusSm);
  }
  .el-input[data-el-variant=segment] .el-input-segment-button:not([data-el-look^=filled]) {
    color: var(--agColorSecondary);
  }
  .el-input[data-el-variant=segment][data-el-has-label]:not([data-el-label-position=left]) {
    padding: 6px 3px 3px 12px;
  }
}
@layer cascade {
  [data-el-cascade-input-look=plain] .el-input:not([data-el-look]) {
    --el-input-background: transparent;
    --el-input-border-width: 0px;
    --el-input-border-radius: 0px;
  }
  [data-el-cascade-input-look=filled] .el-input:not([data-el-look]) {
    --el-input-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --el-input-border-width: 1px;
    --el-input-border-radius: var(--agBorderRadiusMd);
  }
  [data-el-cascade-input-look=borderless] .el-input:not([data-el-look]) {
    --el-input-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --el-input-border-width: 0px;
    --el-input-border-radius: var(--agBorderRadiusMd);
  }
  [data-el-cascade-input-padding=compact] .el-input {
    --el-input-padding-left: var(--el-input-padding-rest);
    --el-input-padding-right: var(--el-input-padding-rest);
  }
}
@layer variant {
  .el-input[data-el-look=plain] {
    --el-input-background: transparent;
    --el-input-border-width: 0px;
    --el-input-border-radius: 0px;
  }
  .el-input[data-el-look=filled] {
    --el-input-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --el-input-border-width: 1px;
    --el-input-border-radius: var(--agBorderRadiusMd);
  }
  .el-input[data-el-look=borderless] {
    --el-input-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --el-input-border-width: 0px;
    --el-input-border-radius: var(--agBorderRadiusMd);
  }
  [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]) .el-input-label,
  .el-input[data-el-label-position=left] .el-input-label {
    font-weight: 400;
    color: var(--agColorPrimary);
  }
  @media (min-width: 1024px) {
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]):not([data-el-input-type=boolean]) .el-input-center,
    .el-input[data-el-label-position=left]:not([data-el-input-type=boolean]) .el-input-center {
      flex-direction: row;
      justify-content: space-between;
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]) .el-input-label,
    .el-input[data-el-label-position=left] .el-input-label {
      height: var(--el-input-section-height);
      max-height: none;
      font-size: var(--el-input-font-size);
      justify-content: center;
      font-weight: 400;
      color: var(--agColorPrimary);
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-has-value] .el-input-label,
    .el-input[data-el-label-position=left][data-el-has-value] .el-input-label {
      max-height: none;
      font-size: var(--el-input-font-size);
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-input-type=textarea] .el-input-label,
    .el-input[data-el-label-position=left][data-el-input-type=textarea] .el-input-label {
      justify-content: start;
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]) input,
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]) textarea,
    .el-input[data-el-label-position=left] input,
    .el-input[data-el-label-position=left] textarea {
      flex: 1;
      text-align: right;
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]):not([data-el-has-label]) input,
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top]):not([data-el-has-label]) textarea,
    .el-input[data-el-label-position=left]:not([data-el-has-label]) input,
    .el-input[data-el-label-position=left]:not([data-el-has-label]) textarea {
      text-align: left;
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-variant=segment],
    .el-input[data-el-label-position=left][data-el-variant=segment] {
      padding: var(--el-input-padding-rest);
      padding-left: var(--el-input-padding-left);
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-variant=segment] .el-input-segment-container,
    .el-input[data-el-label-position=left][data-el-variant=segment] .el-input-segment-container {
      flex: initial;
    }
    [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-variant=segment] .el-input-segment-button,
    .el-input[data-el-label-position=left][data-el-variant=segment] .el-input-segment-button {
      flex: initial;
    }
  }
  [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-input-type=boolean] .el-input-label,
  .el-input[data-el-label-position=left][data-el-input-type=boolean] .el-input-label {
    font-weight: 400;
    height: auto;
  }
  [data-el-cascade-input-label-position=left] .el-input:not([data-el-label-position=top])[data-el-input-type=boolean] .el-input-center,
  .el-input[data-el-label-position=left][data-el-input-type=boolean] .el-input-center {
    flex-direction: column;
    justify-content: center;
  }
  [data-el-cascade-input-label-position=top] .el-input:not([data-el-label-position=left]) .el-input-center,
  .el-input[data-el-label-position=top] .el-input-center {
    flex-direction: column;
    justify-content: center;
  }
  [data-el-cascade-input-label-position=top] .el-input:not([data-el-label-position=left]):not([data-el-input-type^=picker], [data-el-input-type^=date], [data-el-input-type=boolean], [data-el-input-type=color]) .el-input-label,
  .el-input[data-el-label-position=top]:not([data-el-input-type^=picker], [data-el-input-type^=date], [data-el-input-type=boolean], [data-el-input-type=color]) .el-input-label {
    max-height: 0;
  }
  [data-el-cascade-input-label-position=top] .el-input:not([data-el-label-position=left])[data-el-has-value]:not([data-el-input-type=boolean]) .el-input-label,
  .el-input[data-el-label-position=top][data-el-has-value]:not([data-el-input-type=boolean]) .el-input-label {
    max-height: 14px;
    font-size: 10px;
  }
}@layer base {
  :root {
    --El-pressable-active-transform: scale(1);
  }
  [data-el-dir] {
    display: flex;
  }
  [data-el-disabled] {
    position: relative;
    cursor: not-allowed;
    opacity: 0.5;
  }
  [data-el-pressable] {
    position: relative;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
  }
  [data-el-pressable]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: currentColor;
    opacity: 0;
    transition: opacity 0.2s ease-out;
    pointer-events: none;
    z-index: 1;
    border-radius: inherit;
  }
  [data-el-pressable]:not([data-el-disabled]):hover::before {
    opacity: 0.08;
  }
  [data-el-pressable]:not([data-el-disabled]):active {
    transform: var(--El-pressable-active-transform);
    transition-duration: 0.05s;
  }
  [data-el-pressable]:not([data-el-disabled]):active::before {
    opacity: 0.12;
    transition-duration: 0.05s;
  }
  @keyframes el-spin {
    0% {
      transform: translate(-50%, -50%) rotate(0deg);
    }
    100% {
      transform: translate(-50%, -50%) rotate(360deg);
    }
  }
  [data-el-loading] {
    position: relative;
    pointer-events: none;
    cursor: wait;
  }
  [data-el-loading]::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--agColorBackdropSubtle);
    z-index: 10;
  }
  [data-el-loading]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.35em;
    height: 1.35em;
    max-width: calc(100% - 8px);
    max-height: calc(100% - 8px);
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23000'%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.15'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.25' transform='rotate(45 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.38' transform='rotate(90 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.5' transform='rotate(135 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.62' transform='rotate(180 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.75' transform='rotate(225 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.88' transform='rotate(270 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='1' transform='rotate(315 12 12)'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23000'%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.15'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.25' transform='rotate(45 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.38' transform='rotate(90 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.5' transform='rotate(135 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.62' transform='rotate(180 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.75' transform='rotate(225 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='.88' transform='rotate(270 12 12)'/%3E%3Crect x='10.75' y='1.5' width='2.5' height='6' rx='1.25' opacity='1' transform='rotate(315 12 12)'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;
    animation: el-spin 0.8s steps(8, end) infinite;
    z-index: 11;
  }
  .__El_background_icon {
    position: absolute;
    inset: 0;
    margin: auto;
    font-size: 2.25em;
    opacity: 0.18;
    pointer-events: none;
    transition: transform 200ms ease, opacity 200ms ease;
  }
  [data-el-active] > .__El_background_icon {
    transform: scale(1.25);
    opacity: 0.28;
  }
  .__El_badge {
    position: absolute;
    color: var(--agColorPrimary);
    top: 2px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    pointer-events: none;
    user-select: none;
    z-index: 2;
  }
  .__El_badge.__El_badge_dot {
    top: 4px;
    right: 4px;
    min-width: 8px;
    width: 8px;
    height: 8px;
  }
}
@layer cascade {
  [data-el-cascade-preset~=input-card-list]:not([data-el-dir=row]) > :not(:last-child),
  [data-el-cascade-preset~=input-list]:not([data-el-dir=row]) > :not(:last-child) {
    border-bottom: 1px solid var(--agColorBorder);
  }
  [data-el-cascade-preset~=input-card-list][data-el-dir=row] > :not(:last-child),
  [data-el-cascade-preset~=input-list][data-el-dir=row] > :not(:last-child) {
    border-right: 1px solid var(--agColorBorder);
  }
  [data-el-cascade-preset~=input-card-list]:not([data-el-overflow]),
  [data-el-cascade-preset~=input-list]:not([data-el-overflow]) {
    overflow: hidden;
  }
}
@layer variant {
  [data-el-look=card],
  [data-el-cascade-control-group-look=card] [data-el-is=control-group]:not([data-el-look]) {
    border-radius: 18px;
    box-shadow: 0 2px 6px light-dark(transparent, rgba(0, 0, 0, 0.4));
  }
}
@layer props {
  [data-el-font-color=primary] {
    color: var(--agColorPrimary);
  }
  [data-el-font-color=primary-inverse] {
    color: var(--agColorPrimaryInverse);
  }
  [data-el-font-color=secondary] {
    color: var(--agColorSecondary);
  }
  [data-el-font-color=tertiary] {
    color: var(--agColorTertiary);
  }
  [data-el-font-color=brand] {
    color: var(--agColorBrand);
  }
  [data-el-font-color=red] {
    color: var(--agColorRed);
  }
  [data-el-font-color=green] {
    color: var(--agColorGreen);
  }
  [data-el-font-color=orange] {
    color: var(--agColorOrange);
  }
  [data-el-font-color=black] {
    color: black;
  }
  [data-el-font-color=white] {
    color: white;
  }
  [data-el-background=primary] {
    background: var(--agColorPrimary);
  }
  [data-el-background=primary-inverse] {
    background: var(--agColorPrimaryInverse);
  }
  [data-el-background=secondary] {
    background: var(--agColorSecondary);
  }
  [data-el-background=tertiary] {
    background: var(--agColorTertiary);
  }
  [data-el-background=brand] {
    background: var(--agColorBrand);
  }
  [data-el-background=red] {
    background: var(--agColorRed);
  }
  [data-el-background=green] {
    background: var(--agColorGreen);
  }
  [data-el-background=orange] {
    background: var(--agColorOrange);
  }
  [data-el-background=black] {
    background: black;
  }
  [data-el-background=white] {
    background: white;
  }
  [data-el-background=backdrop-light] {
    background: var(--agColorBackdropSubtle);
  }
  [data-el-background=backdrop-medium] {
    background: var(--agColorBackdropMedium);
  }
  [data-el-background=backdrop-heavy] {
    background: var(--agColorBackdropHeavy);
  }
  [data-el-background=opacity-layer] {
    background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
  }
  [data-el-border] {
    border-style: solid;
    border-color: var(--agColorBorder);
    border-width: 1px;
  }
  [data-el-border-top] {
    border-top-style: solid;
    border-top-color: var(--agColorBorder);
    border-top-width: 1px;
  }
  [data-el-border-bottom] {
    border-bottom-style: solid;
    border-bottom-color: var(--agColorBorder);
    border-bottom-width: 1px;
  }
  [data-el-border-left] {
    border-left-style: solid;
    border-left-color: var(--agColorBorder);
    border-left-width: 1px;
  }
  [data-el-border-right] {
    border-right-style: solid;
    border-right-color: var(--agColorBorder);
    border-right-width: 1px;
  }
  [data-el-border="1"] {
    border-width: 1px;
  }
  [data-el-border-top="1"] {
    border-top-width: 1px;
  }
  [data-el-border-bottom="1"] {
    border-bottom-width: 1px;
  }
  [data-el-border-left="1"] {
    border-left-width: 1px;
  }
  [data-el-border-right="1"] {
    border-right-width: 1px;
  }
  [data-el-border="2"] {
    border-width: 2px;
  }
  [data-el-border-top="2"] {
    border-top-width: 2px;
  }
  [data-el-border-bottom="2"] {
    border-bottom-width: 2px;
  }
  [data-el-border-left="2"] {
    border-left-width: 2px;
  }
  [data-el-border-right="2"] {
    border-right-width: 2px;
  }
  [data-el-border="3"] {
    border-width: 3px;
  }
  [data-el-border-top="3"] {
    border-top-width: 3px;
  }
  [data-el-border-bottom="3"] {
    border-bottom-width: 3px;
  }
  [data-el-border-left="3"] {
    border-left-width: 3px;
  }
  [data-el-border-right="3"] {
    border-right-width: 3px;
  }
  [data-el-border="4"] {
    border-width: 4px;
  }
  [data-el-border-top="4"] {
    border-top-width: 4px;
  }
  [data-el-border-bottom="4"] {
    border-bottom-width: 4px;
  }
  [data-el-border-left="4"] {
    border-left-width: 4px;
  }
  [data-el-border-right="4"] {
    border-right-width: 4px;
  }
  [data-el-border-color=primary] {
    border-color: var(--agColorPrimary);
  }
  [data-el-border-color=primary-inverse] {
    border-color: var(--agColorPrimaryInverse);
  }
  [data-el-border-color=secondary] {
    border-color: var(--agColorSecondary);
  }
  [data-el-border-color=tertiary] {
    border-color: var(--agColorTertiary);
  }
  [data-el-border-color=brand] {
    border-color: var(--agColorBrand);
  }
  [data-el-border-color=red] {
    border-color: var(--agColorRed);
  }
  [data-el-border-color=green] {
    border-color: var(--agColorGreen);
  }
  [data-el-border-color=orange] {
    border-color: var(--agColorOrange);
  }
  [data-el-border-color=black] {
    border-color: black;
  }
  [data-el-border-color=white] {
    border-color: white;
  }
  [data-el-border-color=blue] {
    border-color: var(--agColorBrand);
  }
  [data-el-border-color=border] {
    border-color: var(--agColorBorder);
  }
  [data-el-dir=col] {
    flex-direction: column;
  }
  [data-el-dir=row] {
    flex-direction: row;
  }
  [data-el-dir=col][data-el-h-align=start] {
    align-items: flex-start;
  }
  [data-el-dir=col][data-el-h-align=center] {
    align-items: center;
  }
  [data-el-dir=col][data-el-h-align=end] {
    align-items: flex-end;
  }
  [data-el-dir=col][data-el-h-align=stretch] {
    align-items: stretch;
  }
  [data-el-dir=col][data-el-h-align=baseline] {
    align-items: baseline;
  }
  [data-el-dir=col][data-el-v-align=start] {
    justify-content: flex-start;
  }
  [data-el-dir=col][data-el-v-align=center] {
    justify-content: center;
  }
  [data-el-dir=col][data-el-v-align=end] {
    justify-content: flex-end;
  }
  [data-el-dir=col][data-el-v-align=space-between] {
    justify-content: space-between;
  }
  [data-el-dir=col][data-el-v-align=space-around] {
    justify-content: space-around;
  }
  [data-el-dir=col][data-el-v-align=space-evenly] {
    justify-content: space-evenly;
  }
  [data-el-dir=row][data-el-h-align=start] {
    justify-content: flex-start;
  }
  [data-el-dir=row][data-el-h-align=center] {
    justify-content: center;
  }
  [data-el-dir=row][data-el-h-align=end] {
    justify-content: flex-end;
  }
  [data-el-dir=row][data-el-h-align=space-between] {
    justify-content: space-between;
  }
  [data-el-dir=row][data-el-h-align=space-around] {
    justify-content: space-around;
  }
  [data-el-dir=row][data-el-h-align=space-evenly] {
    justify-content: space-evenly;
  }
  [data-el-dir=row][data-el-v-align=start] {
    align-items: flex-start;
  }
  [data-el-dir=row][data-el-v-align=center] {
    align-items: center;
  }
  [data-el-dir=row][data-el-v-align=end] {
    align-items: flex-end;
  }
  [data-el-dir=row][data-el-v-align=stretch] {
    align-items: stretch;
  }
  [data-el-dir=row][data-el-v-align=baseline] {
    align-items: baseline;
  }
  [data-el-flex-wrap=wrap] {
    flex-wrap: wrap;
  }
  [data-el-flex-wrap=nowrap] {
    flex-wrap: nowrap;
  }
  [data-el-grow] {
    flex: 1;
  }
  [data-el-no-shrink] {
    flex-shrink: 0;
  }
  [data-el-overflow=auto] {
    overflow: auto;
  }
  [data-el-overflow=hidden] {
    overflow: hidden;
  }
  [data-el-max-lines] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  [data-el-max-lines="1"] {
    -webkit-line-clamp: 1;
    line-clamp: 1;
  }
  [data-el-max-lines="2"] {
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }
  [data-el-gap=none] {
    gap: 0;
  }
  [data-el-padding=none] {
    padding: 0;
  }
  [data-el-padding-x=none] {
    padding-left: 0;
    padding-right: 0;
  }
  [data-el-padding-y=none] {
    padding-top: 0;
    padding-bottom: 0;
  }
  [data-el-padding-left=none] {
    padding-left: 0;
  }
  [data-el-padding-right=none] {
    padding-right: 0;
  }
  [data-el-padding-top=none] {
    padding-top: 0;
  }
  [data-el-padding-bottom=none] {
    padding-bottom: 0;
  }
  [data-el-gap=xxs] {
    gap: 2px;
  }
  [data-el-padding=xxs] {
    padding: 2px;
  }
  [data-el-padding-x=xxs] {
    padding-left: 2px;
    padding-right: 2px;
  }
  [data-el-padding-y=xxs] {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  [data-el-padding-left=xxs] {
    padding-left: 2px;
  }
  [data-el-padding-right=xxs] {
    padding-right: 2px;
  }
  [data-el-padding-top=xxs] {
    padding-top: 2px;
  }
  [data-el-padding-bottom=xxs] {
    padding-bottom: 2px;
  }
  [data-el-gap=xs] {
    gap: 4px;
  }
  [data-el-padding=xs] {
    padding: 4px;
  }
  [data-el-padding-x=xs] {
    padding-left: 4px;
    padding-right: 4px;
  }
  [data-el-padding-y=xs] {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  [data-el-padding-left=xs] {
    padding-left: 4px;
  }
  [data-el-padding-right=xs] {
    padding-right: 4px;
  }
  [data-el-padding-top=xs] {
    padding-top: 4px;
  }
  [data-el-padding-bottom=xs] {
    padding-bottom: 4px;
  }
  [data-el-gap=sm] {
    gap: 8px;
  }
  [data-el-padding=sm] {
    padding: 8px;
  }
  [data-el-padding-x=sm] {
    padding-left: 8px;
    padding-right: 8px;
  }
  [data-el-padding-y=sm] {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  [data-el-padding-left=sm] {
    padding-left: 8px;
  }
  [data-el-padding-right=sm] {
    padding-right: 8px;
  }
  [data-el-padding-top=sm] {
    padding-top: 8px;
  }
  [data-el-padding-bottom=sm] {
    padding-bottom: 8px;
  }
  [data-el-gap=md] {
    gap: 12px;
  }
  [data-el-padding=md] {
    padding: 12px;
  }
  [data-el-padding-x=md] {
    padding-left: 12px;
    padding-right: 12px;
  }
  [data-el-padding-y=md] {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  [data-el-padding-left=md] {
    padding-left: 12px;
  }
  [data-el-padding-right=md] {
    padding-right: 12px;
  }
  [data-el-padding-top=md] {
    padding-top: 12px;
  }
  [data-el-padding-bottom=md] {
    padding-bottom: 12px;
  }
  [data-el-gap=lg] {
    gap: 16px;
  }
  [data-el-padding=lg] {
    padding: 16px;
  }
  [data-el-padding-x=lg] {
    padding-left: 16px;
    padding-right: 16px;
  }
  [data-el-padding-y=lg] {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  [data-el-padding-left=lg] {
    padding-left: 16px;
  }
  [data-el-padding-right=lg] {
    padding-right: 16px;
  }
  [data-el-padding-top=lg] {
    padding-top: 16px;
  }
  [data-el-padding-bottom=lg] {
    padding-bottom: 16px;
  }
  [data-el-gap=xl] {
    gap: 24px;
  }
  [data-el-padding=xl] {
    padding: 24px;
  }
  [data-el-padding-x=xl] {
    padding-left: 24px;
    padding-right: 24px;
  }
  [data-el-padding-y=xl] {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  [data-el-padding-left=xl] {
    padding-left: 24px;
  }
  [data-el-padding-right=xl] {
    padding-right: 24px;
  }
  [data-el-padding-top=xl] {
    padding-top: 24px;
  }
  [data-el-padding-bottom=xl] {
    padding-bottom: 24px;
  }
  [data-el-gap=xxl] {
    gap: 32px;
  }
  [data-el-padding=xxl] {
    padding: 32px;
  }
  [data-el-padding-x=xxl] {
    padding-left: 32px;
    padding-right: 32px;
  }
  [data-el-padding-y=xxl] {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  [data-el-padding-left=xxl] {
    padding-left: 32px;
  }
  [data-el-padding-right=xxl] {
    padding-right: 32px;
  }
  [data-el-padding-top=xxl] {
    padding-top: 32px;
  }
  [data-el-padding-bottom=xxl] {
    padding-bottom: 32px;
  }
  [data-el-font-size=xxs] {
    font-size: 8px;
    font-weight: 700;
    text-transform: uppercase;
  }
  [data-el-font-size=xs] {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
  }
  [data-el-font-size=sm] {
    font-size: 12px;
  }
  [data-el-font-size=md] {
    font-size: 14px;
  }
  [data-el-font-size=lg] {
    font-size: 18px;
    font-weight: 500;
  }
  [data-el-font-size=xl] {
    font-size: 22px;
  }
  [data-el-font-size=xxl] {
    font-size: 26px;
  }
  [data-el-border-radius=none] {
    border-radius: 0;
  }
  [data-el-border-radius=xxs] {
    border-radius: var(--agBorderRadiusXxs);
  }
  [data-el-border-radius=xs] {
    border-radius: var(--agBorderRadiusXs);
  }
  [data-el-border-radius=sm] {
    border-radius: var(--agBorderRadiusSm);
  }
  [data-el-border-radius=md] {
    border-radius: var(--agBorderRadiusMd);
  }
  [data-el-border-radius=lg] {
    border-radius: var(--agBorderRadiusLg);
  }
  [data-el-border-radius=xl] {
    border-radius: var(--agBorderRadiusXl);
  }
  [data-el-border-radius=full] {
    border-radius: var(--agBorderRadiusFull);
  }
  [data-el-border-radius=inherit] {
    border-radius: inherit;
  }
  [data-el-z-index=under] {
    z-index: -1;
  }
  [data-el-z-index=raised] {
    z-index: 1;
  }
  [data-el-z-index=sticky] {
    z-index: 10;
  }
  [data-el-z-index=overlay] {
    z-index: 10000;
  }
  [data-el-z-index=toast] {
    z-index: 20000;
  }
  [data-el-z-index=max] {
    z-index: 99999;
  }
  [data-el-box-shadow=none] {
    box-shadow: none;
  }
  [data-el-box-shadow=glass] {
    box-shadow: inset 0 1px 0 var(--agLookGlassHighlight, light-dark(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.2))), inset 0 0 0 1px var(--agLookGlassBorder, light-dark(rgba(0, 0, 0, 0.06), rgba(255, 255, 255, 0.1))), 0 4px 12px var(--agLookGlassShadow, light-dark(rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.4))), inset 0 2px 4px rgba(0, 0, 0, 0.05);
  }
}
@layer reset {
  button[data-el-is=button] {
    all: unset;
  }
}
@layer base {
  :root {
    --El-button-min-size: var(--agControlSizeMd);
    --El-button-gap: 8px;
    --El-button-font-size: 14px;
    --El-button-font-weight: 500;
    --El-button-text-transform: initial;
    --El-button-padding-x: 16px;
    --El-button-color: var(--agColorPrimary);
    --El-button-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --El-button-border-radius: 4em;
    --El-button-box-shadow: none;
  }
  [data-el-is=button] {
    position: relative;
    flex-shrink: 0;
    min-width: var(--El-button-min-width, var(--El-button-min-size));
    min-height: var(--El-button-min-height, var(--El-button-min-size));
    isolation: isolate;
    display: inline-flex;
    vertical-align: middle;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: var(--El-button-gap);
    text-align: center;
    font-family: var(--El-button-font-family, var(--agFontFamily)), sans-serif;
    font-size: var(--El-button-font-size);
    font-weight: var(--El-button-font-weight);
    text-transform: var(--El-button-text-transform);
    white-space: nowrap;
    padding-left: var(--El-button-padding-left, var(--El-button-padding-x));
    padding-right: var(--El-button-padding-right, var(--El-button-padding-x));
    color: var(--El-button-color);
    background: var(--El-button-background);
    border-radius: var(--El-button-border-radius);
    box-shadow: var(--El-button-box-shadow);
  }
  [data-el-is=button][data-el-icon-only] {
    padding-left: 0;
    padding-right: 0;
  }
}
@layer variant {
  [data-el-cascade-button-size=xxs],
  [data-el-is=button][data-el-size=xxs] {
    --El-button-min-size: var(--agControlSizeXxs);
    --El-button-padding-x: 8px;
    --El-button-gap: 2px;
    --El-button-font-size: 8px;
    --El-button-font-weight: 900;
    --El-button-text-transform: uppercase;
    --El-button-icon-size: 12px;
    --El-button-icon-fill: 1;
  }
  [data-el-cascade-button-size=xs],
  [data-el-is=button][data-el-size=xs] {
    --El-button-min-size: var(--agControlSizeXs);
    --El-button-padding-x: 12px;
    --El-button-gap: 2px;
    --El-button-font-size: 10px;
    --El-button-font-weight: 600;
    --El-button-text-transform: initial;
    --El-button-icon-size: 16px;
    --El-button-icon-fill: 1;
  }
  [data-el-cascade-button-size=sm],
  [data-el-is=button][data-el-size=sm] {
    --El-button-min-size: var(--agControlSizeSm);
    --El-button-padding-x: 12px;
    --El-button-gap: 4px;
    --El-button-font-size: 12px;
    --El-button-font-weight: 500;
    --El-button-text-transform: initial;
    --El-button-icon-size: 20px;
    --El-button-icon-fill: 0;
  }
  [data-el-cascade-button-size=md],
  [data-el-is=button][data-el-size=md] {
    --El-button-min-size: var(--agControlSizeMd);
    --El-button-padding-x: 16px;
    --El-button-gap: 8px;
    --El-button-font-size: 14px;
    --El-button-font-weight: 500;
    --El-button-text-transform: initial;
    --El-button-icon-size: 24px;
    --El-button-icon-fill: 0;
  }
  [data-el-cascade-button-size=lg],
  [data-el-is=button][data-el-size=lg] {
    --El-button-min-size: var(--agControlSizeLg);
    --El-button-padding-x: 16px;
    --El-button-gap: 12px;
    --El-button-font-size: 16px;
    --El-button-font-weight: 500;
    --El-button-text-transform: initial;
    --El-button-icon-size: 28px;
    --El-button-icon-fill: 0;
  }
  [data-el-cascade-button-size=xl],
  [data-el-is=button][data-el-size=xl] {
    --El-button-min-size: var(--agControlSizeXl);
    --El-button-padding-x: 32px;
    --El-button-gap: 8px;
    --El-button-font-size: 20px;
    --El-button-font-weight: 500;
    --El-button-text-transform: initial;
    --El-button-icon-size: 32px;
    --El-button-icon-fill: 0;
  }
  [data-el-cascade-button-size=xxl],
  [data-el-is=button][data-el-size=xxl] {
    --El-button-min-size: var(--agControlSizeXxl);
    --El-button-padding-x: 32px;
    --El-button-gap: 8px;
    --El-button-font-size: 26px;
    --El-button-font-weight: 500;
    --El-button-text-transform: initial;
    --El-button-icon-size: 36px;
    --El-button-icon-fill: 0;
  }
  [data-el-cascade-button-look=plain] {
    --El-button-background: transparent;
    --El-button-color: var(--agColorPrimary);
  }
  [data-el-cascade-button-look=plain-brand] {
    --El-button-background: transparent;
    --El-button-color: var(--agColorBrand);
  }
  [data-el-cascade-button-look=plain-red] {
    --El-button-background: transparent;
    --El-button-color: var(--agColorRed);
  }
  [data-el-cascade-button-look=plain-green] {
    --El-button-background: transparent;
    --El-button-color: var(--agColorGreen);
  }
  [data-el-cascade-button-look=plain-orange] {
    --El-button-background: transparent;
    --El-button-color: var(--agColorOrange);
  }
  [data-el-cascade-button-look=tinted-brand] {
    --El-button-background: var(--agColorBrandTinted);
    --El-button-color: var(--agColorBrand);
  }
  [data-el-cascade-button-look=tinted-red] {
    --El-button-background: var(--agColorRedTinted);
    --El-button-color: var(--agColorRed);
  }
  [data-el-cascade-button-look=tinted-green] {
    --El-button-background: var(--agColorGreenTinted);
    --El-button-color: var(--agColorGreen);
  }
  [data-el-cascade-button-look=tinted-orange] {
    --El-button-background: var(--agColorOrangeTinted);
    --El-button-color: var(--agColorOrange);
  }
  [data-el-cascade-button-look=filled-brand] {
    --El-button-background: var(--agColorBrand);
    --El-button-color: #ffffff;
  }
  [data-el-cascade-button-look=filled-red] {
    --El-button-background: var(--agColorRed);
    --El-button-color: #ffffff;
  }
  [data-el-cascade-button-look=filled-green] {
    --El-button-background: var(--agColorGreen);
    --El-button-color: #ffffff;
  }
  [data-el-cascade-button-look=filled-orange] {
    --El-button-background: var(--agColorOrange);
    --El-button-color: #ffffff;
  }
  [data-el-cascade-button-min-width=none] {
    --El-button-min-width: 0;
  }
  [data-el-cascade-button-min-height=none] {
    --El-button-min-height: 0;
  }
  [data-el-cascade-button-min-width=xxs] {
    --El-button-min-width: var(--agControlSizeXxs);
  }
  [data-el-cascade-button-min-height=xxs] {
    --El-button-min-height: var(--agControlSizeXxs);
  }
  [data-el-cascade-button-min-width=xs] {
    --El-button-min-width: var(--agControlSizeXs);
  }
  [data-el-cascade-button-min-height=xs] {
    --El-button-min-height: var(--agControlSizeXs);
  }
  [data-el-cascade-button-min-width=sm] {
    --El-button-min-width: var(--agControlSizeSm);
  }
  [data-el-cascade-button-min-height=sm] {
    --El-button-min-height: var(--agControlSizeSm);
  }
  [data-el-cascade-button-min-width=md] {
    --El-button-min-width: var(--agControlSizeMd);
  }
  [data-el-cascade-button-min-height=md] {
    --El-button-min-height: var(--agControlSizeMd);
  }
  [data-el-cascade-button-min-width=lg] {
    --El-button-min-width: var(--agControlSizeLg);
  }
  [data-el-cascade-button-min-height=lg] {
    --El-button-min-height: var(--agControlSizeLg);
  }
  [data-el-cascade-button-min-width=xl] {
    --El-button-min-width: var(--agControlSizeXl);
  }
  [data-el-cascade-button-min-height=xl] {
    --El-button-min-height: var(--agControlSizeXl);
  }
  [data-el-cascade-button-min-width=xxl] {
    --El-button-min-width: var(--agControlSizeXxl);
  }
  [data-el-cascade-button-min-height=xxl] {
    --El-button-min-height: var(--agControlSizeXxl);
  }
  [data-el-cascade-button-font-size=xxs] {
    --El-button-font-size: 8px;
    --El-button-font-weight: 700;
    --El-button-text-transform: uppercase;
  }
  [data-el-cascade-button-font-size=xs] {
    --El-button-font-size: 10px;
    --El-button-font-weight: 600;
    --El-button-text-transform: uppercase;
  }
  [data-el-cascade-button-font-size=sm] {
    --El-button-font-size: 12px;
  }
  [data-el-cascade-button-font-size=md] {
    --El-button-font-size: 14px;
  }
  [data-el-cascade-button-font-size=lg] {
    --El-button-font-size: 18px;
    --El-button-font-weight: 500;
  }
  [data-el-cascade-button-font-size=xl] {
    --El-button-font-size: 22px;
  }
  [data-el-cascade-button-font-size=xxl] {
    --El-button-font-size: 26px;
  }
  [data-el-cascade-button-padding-x=none] {
    --El-button-padding-x: 0;
  }
  [data-el-cascade-button-padding-x=xxs] {
    --El-button-padding-x: 2px;
  }
  [data-el-cascade-button-padding-x=xs] {
    --El-button-padding-x: 4px;
  }
  [data-el-cascade-button-padding-x=sm] {
    --El-button-padding-x: 8px;
  }
  [data-el-cascade-button-padding-x=md] {
    --El-button-padding-x: 12px;
  }
  [data-el-cascade-button-padding-x=lg] {
    --El-button-padding-x: 16px;
  }
  [data-el-cascade-button-padding-x=xl] {
    --El-button-padding-x: 24px;
  }
  [data-el-cascade-button-padding-x=xxl] {
    --El-button-padding-x: 32px;
  }
  [data-el-cascade-button-box-shadow=none],
  [data-el-is=button][data-el-box-shadow=none] {
    --El-button-box-shadow: none;
  }
  [data-el-cascade-button-box-shadow=glass],
  [data-el-is=button][data-el-box-shadow=glass] {
    --El-button-box-shadow: inset 0 1px 0 var(--agLookGlassHighlight, light-dark(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.2))), inset 0 0 0 1px var(--agLookGlassBorder, light-dark(rgba(0, 0, 0, 0.06), rgba(255, 255, 255, 0.1))), 0 4px 12px var(--agLookGlassShadow, light-dark(rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.4))), inset 0 2px 4px rgba(0, 0, 0, 0.05);
  }
  [data-el-look=plain],
  [data-el-cascade-control-group-look=plain] [data-el-is=control-group]:not([data-el-look]) {
    background: transparent;
    color: var(--agColorPrimary);
  }
  [data-el-look=plain-brand],
  [data-el-cascade-control-group-look=plain-brand] [data-el-is=control-group]:not([data-el-look]) {
    background: transparent;
    color: var(--agColorBrand);
  }
  [data-el-look=plain-red],
  [data-el-cascade-control-group-look=plain-red] [data-el-is=control-group]:not([data-el-look]) {
    background: transparent;
    color: var(--agColorRed);
  }
  [data-el-look=plain-green],
  [data-el-cascade-control-group-look=plain-green] [data-el-is=control-group]:not([data-el-look]) {
    background: transparent;
    color: var(--agColorGreen);
  }
  [data-el-look=plain-orange],
  [data-el-cascade-control-group-look=plain-orange] [data-el-is=control-group]:not([data-el-look]) {
    background: transparent;
    color: var(--agColorOrange);
  }
  [data-el-look=tinted-brand],
  [data-el-cascade-control-group-look=tinted-brand] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorBrandTinted);
    color: var(--agColorBrand);
  }
  [data-el-look=tinted-red],
  [data-el-cascade-control-group-look=tinted-red] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorRedTinted);
    color: var(--agColorRed);
  }
  [data-el-look=tinted-green],
  [data-el-cascade-control-group-look=tinted-green] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorGreenTinted);
    color: var(--agColorGreen);
  }
  [data-el-look=tinted-orange],
  [data-el-cascade-control-group-look=tinted-orange] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorOrangeTinted);
    color: var(--agColorOrange);
  }
  [data-el-look=filled-brand],
  [data-el-cascade-control-group-look=filled-brand] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorBrand);
    color: #ffffff;
  }
  [data-el-look=filled-red],
  [data-el-cascade-control-group-look=filled-red] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorRed);
    color: #ffffff;
  }
  [data-el-look=filled-green],
  [data-el-cascade-control-group-look=filled-green] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorGreen);
    color: #ffffff;
  }
  [data-el-look=filled-orange],
  [data-el-cascade-control-group-look=filled-orange] [data-el-is=control-group]:not([data-el-look]) {
    background: var(--agColorOrange);
    color: #ffffff;
  }
  [data-el-is=button][data-el-active] {
    background: var(--El-button-active-background, var(--agColorPrimary));
    color: var(--El-button-active-color, var(--agColorPrimaryInverse));
  }
  [data-el-is=button][data-el-active][data-el-look=plain-brand], [data-el-is=button][data-el-active][data-el-look=tinted-brand], [data-el-is=button][data-el-active][data-el-look=filled-brand] {
    background: var(--agColorBrand);
    color: #ffffff;
  }
  [data-el-is=button][data-el-active][data-el-look=plain-red], [data-el-is=button][data-el-active][data-el-look=tinted-red], [data-el-is=button][data-el-active][data-el-look=filled-red] {
    background: var(--agColorRed);
    color: #ffffff;
  }
  [data-el-is=button][data-el-active][data-el-look=plain-green], [data-el-is=button][data-el-active][data-el-look=tinted-green], [data-el-is=button][data-el-active][data-el-look=filled-green] {
    background: var(--agColorGreen);
    color: #ffffff;
  }
  [data-el-is=button][data-el-active][data-el-look=plain-orange], [data-el-is=button][data-el-active][data-el-look=tinted-orange], [data-el-is=button][data-el-active][data-el-look=filled-orange] {
    background: var(--agColorOrange);
    color: #ffffff;
  }
}
@layer base {
  :root {
    --El-icon-size: 24px;
    --El-icon-fill: 0;
  }
  [data-el-is=icon] {
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: "Material Symbols Rounded";
    font-size: var(--El-button-icon-size, var(--El-icon-size));
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "liga";
    transition: font-variation-settings 0.2s ease-in-out;
    user-select: none;
    font-variation-settings: "FILL" var(--El-button-icon-fill, var(--El-icon-fill)), "wght" 300;
  }
}
@layer variant {
  [data-el-cascade-icon-filled],
  [data-el-is=icon][data-el-icon-filled] {
    --El-button-icon-fill: 1;
    --El-icon-fill: 1;
  }
  [data-el-is=icon][data-el-size=xxs] {
    font-size: 12px;
  }
  [data-el-is=icon][data-el-size=xs] {
    font-size: 16px;
  }
  [data-el-is=icon][data-el-size=sm] {
    font-size: 20px;
  }
  [data-el-is=icon][data-el-size=md] {
    font-size: 24px;
  }
  [data-el-is=icon][data-el-size=lg] {
    font-size: 28px;
  }
  [data-el-is=icon][data-el-size=xl] {
    font-size: 32px;
  }
  [data-el-is=icon][data-el-size=xxl] {
    font-size: 36px;
  }
}
@layer reset {
  [data-el-is=input] input,
  [data-el-is=input] textarea {
    all: unset;
    box-sizing: border-box;
    cursor: text;
  }
}
@layer base {
  :root {
    --AGInput-size: var(--agControlSizeMd);
    --AGInput-font-size: 14px;
    --AGInput-label-font-size: 10px;
    --AGInput-spacing: 16px;
    --AGInput-gap: 8px;
    --AGInput-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --AGInput-border-width: 1px;
    --AGInput-border-radius: var(--agBorderRadiusMd);
    --AGInput-box-shadow: 0 2px 6px light-dark(transparent, rgba(0, 0, 0, 0.4));
  }
  [data-el-is=input] {
    --box-shadow-color: var(--agColorBorder);
    --animation-duration: 200ms;
    position: relative;
    display: flex;
    gap: var(--AGInput-gap);
    border-radius: var(--AGInput-border-radius);
    border: var(--AGInput-border-width) solid var(--agColorBorder);
    background: var(--AGInput-background);
    box-shadow: var(--AGInput-box-shadow);
    min-height: var(--AGInput-size);
    font-size: var(--AGInput-font-size);
    padding-left: var(--AGInput-padding-left, var(--AGInput-spacing));
    padding-right: var(--AGInput-padding-right, var(--AGInput-spacing));
    transition: box-shadow var(--animation-duration);
    cursor: pointer;
  }
  [data-el-is=input] input,
  [data-el-is=input] textarea {
    width: 100%;
    text-align: left;
  }
  [data-el-is=input] input::placeholder,
  [data-el-is=input] textarea::placeholder {
    color: var(--agColorSecondary);
    text-align: inherit;
  }
  [data-el-is=input] .AGInput-adornment {
    display: flex;
    align-items: center;
    color: var(--agColorTertiary);
  }
  [data-el-is=input] .AGInput-input-container {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: auto;
    justify-content: center;
    min-width: 0;
  }
  [data-el-is=input] .AGInput-segment-container {
    display: flex;
    flex-direction: row;
    gap: 2px;
    overflow: auto;
    align-self: stretch;
    flex: 1;
  }
  [data-el-is=input] .AGInput-segment-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    font-size: var(--agFontXs, 12px);
    font-weight: 500;
    color: var(--agColorSecondary);
    border-radius: var(--agBorderRadiusMd, 8px);
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    transition: all var(--animation-duration);
    padding: 0 var(--AGInput-spacing);
  }
  [data-el-is=input] .AGInput-segment-item:hover, [data-el-is=input] .AGInput-segment-item[data-el-selected] {
    color: var(--agColorBrand);
    background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.15));
  }
  [data-el-is=input] .AGInput-picker-multi-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4px;
  }
  [data-el-is=input] .AGInput-label {
    display: flex;
    flex-direction: column;
    align-items: start;
    pointer-events: none;
    color: var(--agColorSecondary);
    white-space: nowrap;
    flex-shrink: 0;
    overflow: hidden;
    font-weight: 500;
    font-size: 0px;
    opacity: 0;
    transition: all var(--animation-duration);
  }
  [data-el-is=input] .placeholder {
    display: flex;
    align-items: center;
    color: var(--agColorSecondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    user-select: none;
    pointer-events: none;
  }
  [data-el-is=input][data-el-has-value] .AGInput-label {
    font-size: var(--AGInput-label-font-size);
    opacity: 1;
  }
  [data-el-is=input][data-el-has-value][data-el-has-focus] .placeholder {
    color: var(--agColorBrand);
  }
  [data-el-is=input][data-el-has-focus], [data-el-is=input]:focus-visible {
    --box-shadow-color: var(--agColorBrand);
  }
  [data-el-is=input] .AGInput-switch-container {
    --container-width: 44px;
    --container-size: 24px;
    --gap: 2px;
    --toggle-size: calc(var(--container-size) - 2 * var(--gap));
    --color-toggle: white;
    --color-checked-background: var(--agColorBrand);
    --color-background: var(--agColorBorder, #ccc);
    flex-shrink: 0;
    position: relative;
    display: inline-block;
    width: var(--container-width);
    height: var(--container-size);
    cursor: pointer;
  }
  [data-el-is=input] .AGInput-switch-container[data-el-disabled] {
    cursor: not-allowed;
  }
  [data-el-is=input] .AGInput-switch {
    height: 100%;
    position: absolute;
    cursor: pointer;
    inset: 0;
    background-color: var(--color-background);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    border-radius: 34px;
  }
  [data-el-is=input] .AGInput-switch:before {
    position: absolute;
    content: "";
    height: var(--toggle-size);
    width: var(--toggle-size);
    left: var(--gap);
    bottom: var(--gap);
    background-color: var(--color-toggle);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  }
  [data-el-is=input] .AGInput-switch[data-el-active] {
    background-color: var(--color-checked-background);
  }
  [data-el-is=input] .AGInput-switch[data-el-active]:before {
    transform: translateX(calc(var(--container-width) - var(--toggle-size) - 2 * var(--gap)));
  }
}
@layer variant {
  [data-el-is=input][data-el-input-text-align=left] input,
  [data-el-is=input][data-el-input-text-align=left] textarea {
    text-align: left;
  }
  [data-el-is=input][data-el-input-text-align=center] input,
  [data-el-is=input][data-el-input-text-align=center] textarea {
    text-align: center;
  }
  [data-el-is=input][data-el-input-text-align=right] input,
  [data-el-is=input][data-el-input-text-align=right] textarea {
    text-align: right;
  }
  [data-el-is=input][data-el-type=textarea] textarea {
    padding: 4px 0;
  }
  [data-el-is=input][data-el-type=textarea][data-el-has-value] textarea {
    padding-bottom: 8px;
  }
  [data-el-is=input][data-el-type=picker_multi] .AGInput-input-container {
    padding-bottom: 4px;
  }
  [data-el-is=input][data-el-type=picker_multi]:not([data-el-has-label]) .AGInput-input-container, [data-el-is=input][data-el-type=picker_multi]:not([data-el-has-value]) .AGInput-input-container {
    padding-top: 4px;
  }
  [data-el-is=input][data-el-variant=segment] {
    padding: 2px;
  }
  [data-el-is=input][data-el-type=color] input[type=color] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
  }
  [data-el-is=input][data-el-type=color] input[type=color]:disabled {
    cursor: not-allowed;
  }
  [data-el-is=input][data-el-type=phone] {
    padding-left: 0;
    gap: 0;
  }
  [data-el-is=input][data-el-type=phone] .AGInput-input-container {
    padding-left: var(--AGInput-spacing, 16px);
  }
  [data-el-is=input][data-el-type=boolean] {
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
  }
  [data-el-is=input][data-el-type=boolean] .AGInput-label {
    font-size: var(--agFontMd);
    opacity: 1;
    color: var(--agColorPrimary);
  }
  [data-el-is=input][data-el-type=boolean]:not([data-el-has-label]) {
    justify-content: center;
  }
  [data-el-is=input][data-el-type=boolean]:not([data-el-has-label]) .AGInput-input-container {
    display: none;
  }
  [data-el-is=input][data-el-size=xxs] {
    --AGInput-size: var(--agControlSizeXxs);
    --AGInput-spacing: 8px;
    --AGInput-gap: 2px;
    --AGInput-font-size: 8px;
    --AGInput-label-font-size: 8px;
  }
  [data-el-is=input][data-el-size=xs] {
    --AGInput-size: var(--agControlSizeXs);
    --AGInput-spacing: 6px;
    --AGInput-gap: 2px;
    --AGInput-font-size: 10px;
    --AGInput-label-font-size: 8px;
  }
  [data-el-is=input][data-el-size=sm] {
    --AGInput-size: var(--agControlSizeSm);
    --AGInput-spacing: 8px;
    --AGInput-gap: 4px;
    --AGInput-font-size: 12px;
    --AGInput-label-font-size: 9px;
  }
  [data-el-is=input][data-el-size=md] {
    --AGInput-size: var(--agControlSizeMd);
    --AGInput-spacing: 12px;
    --AGInput-gap: 8px;
    --AGInput-font-size: 14px;
    --AGInput-label-font-size: 10px;
  }
  [data-el-is=input][data-el-size=lg] {
    --AGInput-size: var(--agControlSizeLg);
    --AGInput-spacing: 12px;
    --AGInput-gap: 12px;
    --AGInput-font-size: 16px;
    --AGInput-label-font-size: 11px;
  }
  [data-el-is=input][data-el-size=xl] {
    --AGInput-size: var(--agControlSizeXl);
    --AGInput-spacing: 16px;
    --AGInput-gap: 8px;
    --AGInput-font-size: 20px;
    --AGInput-label-font-size: 12px;
  }
  [data-el-is=input][data-el-size=xxl] {
    --AGInput-size: var(--agControlSizeXxl);
    --AGInput-spacing: 16px;
    --AGInput-gap: 8px;
    --AGInput-font-size: 26px;
    --AGInput-label-font-size: 14px;
  }
  @media (min-width: 1024px) {
    [data-el-cascade-input-label-position=left] [data-el-is=input] .AGInput-input-container,
    [data-el-is=input][data-el-label-position=left] .AGInput-input-container {
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input] .AGInput-label,
    [data-el-is=input][data-el-label-position=left] .AGInput-label {
      font-size: var(--agFontMd);
      opacity: 1;
      padding: 8px 0;
      color: var(--agColorPrimary);
      font-weight: 400;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input] input,
    [data-el-cascade-input-label-position=left] [data-el-is=input] textarea,
    [data-el-is=input][data-el-label-position=left] input,
    [data-el-is=input][data-el-label-position=left] textarea {
      flex: 1;
      text-align: right;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input] .AGInput-segment-container,
    [data-el-is=input][data-el-label-position=left] .AGInput-segment-container {
      flex: initial;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input][data-el-type=textarea] .AGInput-input-container,
    [data-el-is=input][data-el-label-position=left][data-el-type=textarea] .AGInput-input-container {
      align-items: start;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input][data-el-type=textarea] textarea,
    [data-el-is=input][data-el-label-position=left][data-el-type=textarea] textarea {
      padding-top: 8px;
      padding-bottom: 8px;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input][data-el-variant=segment],
    [data-el-is=input][data-el-label-position=left][data-el-variant=segment] {
      padding: 4px 4px 4px var(--AGInput-spacing);
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input]:not([data-el-has-label]) input,
    [data-el-cascade-input-label-position=left] [data-el-is=input]:not([data-el-has-label]) textarea,
    [data-el-is=input][data-el-label-position=left]:not([data-el-has-label]) input,
    [data-el-is=input][data-el-label-position=left]:not([data-el-has-label]) textarea {
      text-align: left;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input][data-el-has-label]:not([data-el-has-placeholder]) input::placeholder,
    [data-el-cascade-input-label-position=left] [data-el-is=input][data-el-has-label]:not([data-el-has-placeholder]) textarea::placeholder,
    [data-el-is=input][data-el-label-position=left][data-el-has-label]:not([data-el-has-placeholder]) input::placeholder,
    [data-el-is=input][data-el-label-position=left][data-el-has-label]:not([data-el-has-placeholder]) textarea::placeholder {
      color: transparent;
    }
    [data-el-cascade-input-label-position=left] [data-el-is=input][data-el-type=picker_multi] .AGInput-input-container,
    [data-el-is=input][data-el-label-position=left][data-el-type=picker_multi] .AGInput-input-container {
      padding-top: 4px;
    }
  }
  [data-el-cascade-input-look=plain] {
    --AGInput-background: transparent;
    --AGInput-border-width: 0px;
    --AGInput-border-radius: 0px;
    --AGInput-box-shadow: none;
  }
  [data-el-cascade-input-look=filled] {
    --AGInput-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --AGInput-border-width: 1px;
    --AGInput-border-radius: var(--agBorderRadiusMd);
    --AGInput-box-shadow: 0 2px 6px light-dark(transparent, rgba(0, 0, 0, 0.4));
  }
  [data-el-cascade-input-look=borderless] {
    --AGInput-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --AGInput-border-width: 0px;
    --AGInput-border-radius: var(--agBorderRadiusMd);
    --AGInput-box-shadow: 0 2px 6px light-dark(transparent, rgba(0, 0, 0, 0.4));
  }
  [data-el-is=input][data-el-look=plain] {
    --AGInput-background: transparent;
    --AGInput-border-width: 0px;
    --AGInput-border-radius: 0px;
    --AGInput-box-shadow: none;
  }
  [data-el-is=input][data-el-look=filled] {
    --AGInput-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --AGInput-border-width: 1px;
    --AGInput-border-radius: var(--agBorderRadiusMd);
    --AGInput-box-shadow: 0 2px 6px light-dark(transparent, rgba(0, 0, 0, 0.4));
  }
  [data-el-is=input][data-el-look=borderless] {
    --AGInput-background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.1));
    --AGInput-border-width: 0px;
    --AGInput-border-radius: var(--agBorderRadiusMd);
    --AGInput-box-shadow: 0 2px 6px light-dark(transparent, rgba(0, 0, 0, 0.4));
  }
  [data-el-cascade-input-border-radius=none],
  [data-el-is=input][data-el-border-radius=none] {
    --AGInput-border-radius: 0;
  }
  [data-el-cascade-input-border-radius=xxs],
  [data-el-is=input][data-el-border-radius=xxs] {
    --AGInput-border-radius: var(--agBorderRadiusXxs);
  }
  [data-el-cascade-input-border-radius=xs],
  [data-el-is=input][data-el-border-radius=xs] {
    --AGInput-border-radius: var(--agBorderRadiusXs);
  }
  [data-el-cascade-input-border-radius=sm],
  [data-el-is=input][data-el-border-radius=sm] {
    --AGInput-border-radius: var(--agBorderRadiusSm);
  }
  [data-el-cascade-input-border-radius=md],
  [data-el-is=input][data-el-border-radius=md] {
    --AGInput-border-radius: var(--agBorderRadiusMd);
  }
  [data-el-cascade-input-border-radius=lg],
  [data-el-is=input][data-el-border-radius=lg] {
    --AGInput-border-radius: var(--agBorderRadiusLg);
  }
  [data-el-cascade-input-border-radius=xl],
  [data-el-is=input][data-el-border-radius=xl] {
    --AGInput-border-radius: var(--agBorderRadiusXl);
  }
  [data-el-cascade-input-border-radius=full],
  [data-el-is=input][data-el-border-radius=full] {
    --AGInput-border-radius: var(--agBorderRadiusFull);
  }
  [data-el-cascade-input-border-radius=inherit],
  [data-el-is=input][data-el-border-radius=inherit] {
    --AGInput-border-radius: inherit;
  }
}
@layer base {
  [data-el-is=control-group] {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    border-radius: var(--agBorderRadiusMd);
    --El-button-background: transparent;
    --El-button-box-shadow: none;
    --El-button-active-background: var(--agColorPrimary);
    --El-button-active-color: var(--agColorPrimaryInverse);
  }
  [data-el-is=control-group] [data-el-is=button]:not([data-el-border-radius]) {
    border-radius: inherit;
  }
  [data-el-is=control-group][data-el-grow] {
    display: flex;
    width: 100%;
  }
  [data-el-is=control-group][data-el-grow] > [data-el-is=button]:not([data-el-icon-only]) {
    flex: 1 1 0px;
  }
  [data-el-is=control-group][data-el-grow] > [data-el-is=button][data-el-icon-only],
  [data-el-is=control-group][data-el-grow] > :has(> [data-el-is=button][data-el-icon-only]) {
    flex: 0 0 auto;
  }
}
@layer variant {
  [data-el-is=control-group][data-el-look=plain],
  [data-el-cascade-control-group-look=plain] [data-el-is=control-group]:not([data-el-look]) {
    padding: 0;
    gap: var(--agSpacingXs);
  }
}
@layer props {
  [data-el-cascade-control-group-dir=col] [data-el-is=control-group]:not([data-el-control-group-dir]) {
    flex-direction: column;
  }
  [data-el-cascade-control-group-dir=row] [data-el-is=control-group]:not([data-el-control-group-dir]) {
    flex-direction: row;
  }
}
@layer base {
  [data-el-is=root] {
    background: var(--agColorRoot);
    overscroll-behavior: none;
    height: 100%;
    width: 100%;
  }
}
@layer base {
  [data-el-is=main] {
    flex: 1 1 0;
    overflow: auto;
    overscroll-behavior: none;
  }
}
@layer base {
  [data-el-is=header] {
    overscroll-behavior: none;
    padding-top: env(safe-area-inset-top);
    overflow: auto;
    border-bottom: 1px solid var(--agColorBorder);
    box-shadow: 0 4px 12px -2px light-dark(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.4));
    z-index: 1;
  }
}
@layer base {
  [data-el-is=footer] {
    overscroll-behavior: none;
    padding-bottom: env(safe-area-inset-bottom);
    border-top: 1px solid light-dark(rgba(0, 0, 0, 0.08), rgba(255, 255, 255, 0.08));
    box-shadow: 0 -4px 12px -2px light-dark(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.4));
    z-index: 1;
  }
}
@layer base {
  [data-el-is=toolbar] {
    --toolbar-border: 1px solid
        light-dark(
            color-mix(in srgb, var(--agColorBorder) 75%, transparent),
            color-mix(in srgb, var(--agColorBorder) 25%, transparent)
        );
    overflow: auto;
    z-index: 1;
  }
  [data-el-is=toolbar][data-el-position^=right i] {
    flex-direction: column;
    border-left: var(--toolbar-border);
  }
  [data-el-is=toolbar][data-el-position^=left i] {
    flex-direction: column;
    border-right: var(--toolbar-border);
  }
  [data-el-is=toolbar][data-el-position^=top i] {
    flex-direction: row;
    border-bottom: var(--toolbar-border);
  }
  [data-el-is=toolbar][data-el-position^=bottom i] {
    flex-direction: row;
    border-top: var(--toolbar-border);
  }
}
@layer base {
  [data-el-is=anchor] {
    display: flex;
    overflow: visible;
    position: relative;
    z-index: 10;
    flex-direction: column;
  }
  [data-el-is=anchor][data-el-position*=bottom i], [data-el-is=anchor][id=footer] {
    flex-direction: column-reverse;
  }
  [data-el-is=anchor][data-el-position*=right i] {
    align-items: flex-end;
  }
  [data-el-is=anchor][data-el-position*=left i] {
    align-items: flex-start;
  }
  [data-el-is=anchor][data-el-position*=center i] {
    align-items: center;
  }
  [data-el-is=anchor] {
    width: 100%;
    height: 0;
  }
  [data-el-is=anchor][data-el-position^=left i]:not([data-el-position*=top i]):not([data-el-position*=bottom i]), [data-el-is=anchor][data-el-position^=right i]:not([data-el-position*=top i]):not([data-el-position*=bottom i]) {
    width: 0;
    height: 100%;
  }
  [data-el-is=anchor][data-el-takes-space] {
    height: auto;
  }
  [data-el-is=anchor][data-el-takes-space][data-el-position^=left i]:not([data-el-position*=top i]):not([data-el-position*=bottom i]), [data-el-is=anchor][data-el-takes-space][data-el-position^=right i]:not([data-el-position*=top i]):not([data-el-position*=bottom i]) {
    width: auto;
    height: 100%;
  }
}@keyframes _search-slide-in_ikqgi_1 {
  from {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
._searchBarOverlay_ikqgi_11 {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: var(--size-xs, 8px);
  background-color: var(--agColorRoot);
  animation: _search-slide-in_ikqgi_1 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  will-change: transform, opacity;
}._XButton {
  border-radius: var(--button-border-radius);
}
._XButton.size-0, ._XButton.size-0.iconOnly {
  height: var(--button-input-height);
  font-size: var(--UiText-font-size-1);
}
._XButton.size-0 .UiIconMaterial, ._XButton.size-0.iconOnly .UiIconMaterial {
  font-size: 24px;
}
._XButton.size-0.iconOnly {
  min-width: var(--button-input-height);
}
._XButton.cta {
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 40px;
}._loader_5rij2_1 {
  --box-spinner-border-size: 200px;
  position: relative;
  width: var(--box-spinner-border-size);
  height: var(--box-spinner-border-size);
}

._loading_5rij2_8 {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 32px;
}

._spinnerBox_5rij2_19 {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
}

._configureBorder1_5rij2_28 {
  border: 2px solid var(--x-color-primary);
  width: var(--box-spinner-border-size);
  height: var(--box-spinner-border-size);
  padding: 3px;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  animation: _configure-clockwise_5rij2_1 3s ease-in-out 0s infinite alternate;
}

._configureBorder2_5rij2_40 {
  border: 2px solid var(--x-color-secondary);
  width: var(--box-spinner-border-size);
  height: var(--box-spinner-border-size);
  padding: 3px;
  left: calc(-1 * var(--box-spinner-border-size));
  display: flex;
  justify-content: center;
  align-items: center;
  transform: rotate(45deg);
  animation: _configure-xclockwise_5rij2_1 3s ease-in-out 0s infinite alternate;
}

._configureCore_5rij2_53 {
  width: 100%;
  height: 100%;
  background-color: transparent;
}

@keyframes _configure-clockwise_5rij2_1 {
  0% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(90deg);
  }
  50% {
    transform: rotate(180deg);
  }
  75% {
    transform: rotate(270deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes _configure-xclockwise_5rij2_1 {
  0% {
    transform: rotate(45deg);
  }
  25% {
    transform: rotate(-45deg);
  }
  50% {
    transform: rotate(-135deg);
  }
  75% {
    transform: rotate(-225deg);
  }
  100% {
    transform: rotate(-315deg);
  }
}.XSDialog {
    --animation-duration: 0.3s;
    z-index: 1000;
}

html.admin .XSDialog,
html.admin-v1 .XSDialog {
    --XSDialog-header-padding: 4px;
}

.XSDialog {
    --animation-duration: 0.3s;
    --max-width: 800px;
    --XSDialog-header-padding: 0;
    --XSDialog-footer-padding: var(--size-md);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    animation: XSDialog-fadeIn var(--animation-duration) forwards;
}
@media (hover: hover) {
    .XSDialog {
        --max-width: 1024px;
        --XSDialog-footer-padding: 12px;
    }
}
.XSDialog .XSDialog-container {
    animation: XSDialog-mount var(--animation-duration) forwards;
    box-shadow: none;
    border-radius: var(--XSCard-border-radius);
}
.XSDialog .XSDialog-container:not(.transparent) {
    background: var(--XSDialog-background);
    box-shadow: var(--XSDialog-box-shadow);
}
.XSDialog .XSDialog-container.transparent {
    background: transparent;
    border: none;
}
.XSDialog .XSDialog-header {
    width: 100%;
    min-height: var(--xs-size-control);
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    padding: var(--XSDialog-header-padding);
}
.XSDialog .XSDialog-header.hasChildren {
    padding: 4px;
    padding-left: var(--XSSection-gap);
}
.XSDialog.unmounting {
    animation: XSDialog-fadeOut var(--animation-duration) forwards;
}
.XSDialog.unmounting .XSDialog-container {
    animation: XSDialog-unmount var(--animation-duration) forwards;
}

.XSDialog.size-default {
    flex: 1;
    padding-top: 16px;
}
.XSDialog.size-default .XSDialog-container {
    height: 100%;
}

.XSDialog.size-fitContent {
    display: flex;
    align-items: center;
    width: 100%;
}
.XSDialog.size-fitContent .XSDialog-container {
    width: var(--max-width);
    max-height: 100%;
}
.XSDialog.size-fitContent .XSDialog-header,
.XSDialog.size-fitContent .XSDialog-footer {
    flex-shrink: 0;
    position: sticky;
    background: inherit;
    z-index: 1;
}
.XSDialog.size-fitContent .XSDialog-header {
    top: 0;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}
.XSDialog.size-fitContent .XSDialog-footer {
    bottom: 0;
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
}

.XSDialog.size-fullScreen {
    --max-width: 100%;
}
.XSDialog.size-fullScreen .XSDialog-container {
    width: 100%;
    height: 100%;
    border-radius: 0;
}

.XSDialog-container {
    margin: 0 auto;
    max-width: var(--max-width);
    display: flex;
    flex-direction: column;
    padding-bottom: env(safe-area-inset-bottom);
}
.XSDialog-container .XSDialog-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: auto;
}
.XSDialog-container .XSDialog-footer:not(.raw) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--XSDialog-footer-padding);
    min-height: var(--xs-size-control);
}
.XSDialog-container .XSDialog-footer:not(.raw).single {
    justify-content: flex-end;
}

html:is([color-scheme='light']) .XSDialog-container.XSCard {
    border: 1px solid var(--color-border);
}

@keyframes XSDialog-mount {
    0% {
        transform: translateY(10%);
    }
    100% {
        transform: translateY(0);
    }
}
@keyframes XSDialog-unmount {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(10%);
    }
}
@keyframes XSDialog-fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes XSDialog-fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
.XSSection {
    padding: var(--XSSection-gap);
}
.XSSection.wide {
    padding-left: 0;
    padding-right: 0;
}
.XSSection.XSSection-type-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.XSSection.XSSection-type-row.flex > * {
    flex: 1;
    height: 100%;
}
.XSSection.isToolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.XSSection.isToolbar .subtitle {
    color: var(--color-text-secondary);
}
.XSSection .XSSection-content-left {
    min-height: 40px;
    display: grid;
    align-items: center;
}
.XSSection .XSSection-content-right {
    display: flex;
    align-items: center;
    gap: 4px;
}

section.XSSection:not(:last-of-type) {
    padding-bottom: 0;
}
.XSBox.padding-sm {
    padding: 4px;
}
.XSBox.padding-md {
    padding: 8px;
}
.XSBox.padding-lg {
    padding: 12px;
}
.XSBox.padding-xl {
    padding: 16px;
}
.XSBox.gap-sm {
    gap: 4px;
}
.XSBox.gap-md {
    gap: 8px;
}
.XSBox.gap-lg {
    gap: 12px;
}
.XSBox.gap-xl {
    gap: 16px;
}
.XSBox.gap-section {
    gap: var(--XSSection-gap);
}
.XSBox.gap-none {
    gap: 0;
}
.XSBox.border-top {
    border-top: 1px solid var(--color-border);
}
.XSBox.border-bottom {
    border-bottom: 1px solid var(--color-border);
}
.XSBox.border-left {
    border-left: 1px solid var(--color-border);
}
.XSBox.border-right {
    border-right: 1px solid var(--color-border);
}
.XSBox.XSBox-type-row,
.XSBox.XSBox-type-column {
    display: flex;
    align-items: center;
}
.XSBox.XSBox-type-row.flex-stretch > *,
.XSBox.XSBox-type-row.flex-true > *,
.XSBox.XSBox-type-column.flex-stretch > *,
.XSBox.XSBox-type-column.flex-true > * {
    flex: 1;
    flex-basis: 0;
    flex-shrink: 0;
}
.XSBox.XSBox-type-row.align-start,
.XSBox.XSBox-type-column.align-start {
    align-items: start;
}
.XSBox.XSBox-type-row.align-center,
.XSBox.XSBox-type-column.align-center {
    align-items: center;
}
.XSBox.XSBox-type-row.align-end,
.XSBox.XSBox-type-column.align-end {
    align-items: end;
}
.XSBox.XSBox-type-row.flex-start,
.XSBox.XSBox-type-column.flex-start {
    justify-content: start;
}
.XSBox.XSBox-type-row.flex-center,
.XSBox.XSBox-type-column.flex-center {
    justify-content: center;
}
.XSBox.XSBox-type-row.flex-end,
.XSBox.XSBox-type-column.flex-end {
    justify-content: end;
}
.XSBox.XSBox-type-row.flex-apart,
.XSBox.XSBox-type-column.flex-apart {
    justify-content: space-between;
}
.XSBox.XSBox-type-row.flex-1,
.XSBox.XSBox-type-column.flex-1 {
    flex: 1;
}
.XSBox.justify-start {
    justify-content: start;
}
.XSBox.justify-center {
    justify-content: center;
}
.XSBox.justify-end {
    justify-content: end;
}
.XSBox.justify-space-between {
    justify-content: space-between;
}
.XSBox.XSBox-type-column {
    flex-direction: column;
    align-items: start;
}
.XSBox.XSBox-type-grid {
    display: grid;
}
.XSBox.fullWidth {
    width: 100%;
}
.XSBox.fullHeight {
    height: 100%;
}

.XSBox-type-flex {
    display: flex;
    align-items: center;
}
.XSBox-type-flex.align-start {
    align-items: start;
}
.XSBox-type-flex.justify-start {
    justify-content: start;
}
.XSBox-type-flex.align-center {
    align-items: center;
}
.XSBox-type-flex.justify-center {
    justify-content: center;
}
.XSBox-type-flex.align-end {
    align-items: end;
}
.XSBox-type-flex.justify-end {
    justify-content: end;
}
.XSBox-type-flex.align-space-between {
    align-items: space-between;
}
.XSBox-type-flex.justify-space-between {
    justify-content: space-between;
}
.XSBox-type-flex.dir-row {
    flex-direction: row;
}
.XSBox-type-flex.dir-column {
    flex-direction: column;
}
.XSBox-type-flex.flexChildren > * {
    flex: 1;
}
.XSText.type-title {
    font-size: var(--agFontSizeLg);
}
.XSText.type-label {
    font-weight: 600;
    font-size: var(--agFontSizeXs);
    letter-spacing: var(--XSText-label-letter-spacing);
    text-transform: uppercase;
}
.XSText.type-subtitle {
    font-weight: 600;
    font-size: var(--agFontSizeXs);
    letter-spacing: var(--XSText-label-letter-spacing);
    text-transform: uppercase;
}
.XSText.transform-uppercase {
    text-transform: uppercase;
}
.XSText.color-primary {
    color: var(--color-primary);
}
.XSText.color-success {
    color: var(--color-success);
}
.XSText.color-danger {
    color: var(--color-danger);
}
.XSText.color-warn {
    color: var(--color-warn);
}
.XSText.color-text {
    color: var(--color-text);
}
.XSText.color-text-secondary {
    color: var(--color-text-secondary);
}
.XSText.color-ghost {
    color: var(--color-ghost);
}
.XSText.color-white {
    color: white;
}
.XSText.color-black {
    color: black;
}
.XSText.size-sm {
    font-size: var(--agFontSizeSm);
}
.XSText.size-default {
    font-size: var(--agFontSizeMd);
}
.XSText.size-lg {
    font-size: var(--agFontSizeLg);
}
.XSText.align-left {
    text-align: left;
}
.XSText.align-center {
    text-align: center;
}
.XSText.align-right {
    text-align: right;
}
.XSText.weight-normal {
    font-weight: normal;
}
.XSText.weight-600 {
    font-weight: 600;
}
.XSText.weight-bold {
    font-weight: bold;
}
.XSIcon {
    font-size: 24px;
    transition: var(--transition-duration);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.XSIcon svg {
    height: 24px;
    fill: var(--color-text);
}
.XSIcon.color-primary {
    color: var(--color-primary);
}
.XSIcon.color-primary svg {
    fill: var(--color-primary);
}
.XSIcon.color-success {
    color: var(--color-success);
}
.XSIcon.color-success svg {
    fill: var(--color-success);
}
.XSIcon.color-danger {
    color: var(--color-danger);
}
.XSIcon.color-danger svg {
    fill: var(--color-danger);
}
.XSIcon.color-warn {
    color: var(--color-warn);
}
.XSIcon.color-warn svg {
    fill: var(--color-warn);
}
.XSIcon.color-text {
    color: var(--color-text);
}
.XSIcon.color-text svg {
    fill: var(--color-text);
}
.XSIcon.color-text-secondary {
    color: var(--color-text-secondary);
}
.XSIcon.color-text-secondary svg {
    fill: var(--color-text-secondary);
}
.XSIcon.color-ghost {
    color: var(--color-ghost);
}
.XSIcon.color-ghost svg {
    fill: var(--color-ghost);
}
.XSMask {
    --animation-duration: var(--transition-duration);
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    background: var(--XSMask-background);
    animation: XSMask-mount var(--animation-duration) forwards;
}
.XSMask.unmount {
    animation: XSMask-unmount var(--animation-duration) forwards;
}

@keyframes XSMask-mount {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes XSMask-unmount {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
.xs-disable-scroll {
    overflow: hidden;
    position: fixed;
    width: 100%;
}
.XCard {
  background-color: var(--XCard-background-color);
  border-radius: var(--XCard-border-radius);
}html {
  --XDrawerBottom-overlay-backgroundColor: var(--ui-color-overlay);
  --XDrawerBottom-content-backgroundColor: var(--x-color-body);
}

.XDrawerBottom {
  z-index: var(--XDrawerBottom-z-index);
  overflow: auto;
}
.XDrawerBottom,
.XDrawerBottom > .overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}
.XDrawerBottom > .overlay {
  background-color: var(--XDrawerBottom-overlay-backgroundColor);
}
.XDrawerBottom > .content {
  position: relative;
  animation: animateIn 200ms;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  max-width: var(--drawer-max-width);
  min-height: 100%;
  padding-top: 20vh;
  margin: 0 auto;
}
.XDrawerBottom > .content > .content-container {
  background-color: var(--XDrawerBottom-content-backgroundColor);
  border-top-left-radius: var(--border-radius-large);
  border-top-right-radius: var(--border-radius-large);
  width: 100%;
}
@keyframes animateIn {
  0% {
    transform: translateY(25vh);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}.OrderProductVariantProduct {
  border-left: 0 solid transparent;
  transition: border-left 300ms;
}
.OrderProductVariantProduct.invalid {
  border-left: 4px solid var(--x-color-warning);
}.OrderProductModifierGroup {
  border-left: 0 solid transparent;
  transition: border-left 300ms;
  position: relative;
}
.OrderProductModifierGroup.invalid {
  border-left: 4px solid var(--x-color-warning);
}
.OrderProductModifierGroup .required {
  background-color: var(--x-color-warning);
  color: black;
  font-weight: bold;
  padding: 2px var(--ui-spacing);
  border-radius: 40px;
}
.OrderProductModifierGroup .HORIZONTAL {
  align-items: stretch;
  position: relative;
}
.OrderProductModifierGroup .HORIZONTAL > * {
  transition: background-color 300ms;
}
.OrderProductModifierGroup .overflow-layer {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 68px;
  width: 40px;
  border-bottom-right-radius: var(--XCard-border-radius);
}.ButtonIncrementDecrement {
  --button-increment-decrement-size: var(--ui-size-1);
  position: relative;
}
.ButtonIncrementDecrement .UiButton.iconCircle-true {
  border-radius: var(--x-border-radius);
}
.ButtonIncrementDecrement .UiButton.iconCircle-true:before {
  border-radius: inherit;
}
.ButtonIncrementDecrement .UiButton {
  background-color: var(--XCard-background-color);
  width: var(--button-increment-decrement-size) !important;
  min-width: var(--button-increment-decrement-size) !important;
  height: var(--button-increment-decrement-size) !important;
  opacity: 0.95;
}
.ButtonIncrementDecrement .button-group > * {
  border-radius: 40px;
}
.ButtonIncrementDecrement .button-group > :nth-child(1) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.ButtonIncrementDecrement .button-group > :nth-child(2) {
  border-radius: 0 !important;
}
.ButtonIncrementDecrement .button-group > :nth-child(3) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.ButtonIncrementDecrement .button-decrement {
  position: absolute;
  right: calc(var(--button-increment-decrement-size) * 2);
}
.ButtonIncrementDecrement .button-label {
  position: absolute;
  right: var(--button-increment-decrement-size);
  background-color: var(--x-color-primary);
  font-weight: bold;
}
.ButtonIncrementDecrement .upper-row {
  position: absolute;
  display: flex;
  right: 0;
  bottom: var(--button-increment-decrement-size);
}
.ButtonIncrementDecrement .disabled-true {
  opacity: 0.5;
}._ButtonGroup_1twx2_1 {
  border-radius: 40px;
  box-shadow: 0 0 0 1px var(--color-border);
  height: var(--XButton-height, 48px);
  overflow: auto;
  width: 100%;
  display: flex;
  flex-direction: row;
}
._ButtonGroup_1twx2_1 > * {
  flex: 1;
  height: 100% !important;
  border-radius: 40px !important;
  border: 1px solid transparent !important;
}
._ButtonGroup_1twx2_1 {
  /* Logic from legacy ButtonGroup.scss */
}
._ButtonGroup_1twx2_1 > :first-child {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: 0 !important;
}
._ButtonGroup_1twx2_1 > *:not(:first-child):not(:last-child) {
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}
._ButtonGroup_1twx2_1 > :last-child {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-left: 0 !important;
}.XSAlert {
    --icon-size: 24px;
    --gap: 12px;
    border-radius: var(--XSCard-border-radius);
    position: relative;
}
.XSAlert.icon {
    padding-left: calc(var(--gap) + var(--icon-size));
    min-height: var(--xs-size-control);
}
.XSAlert .XSAlert-icon {
    font-size: var(--icon-size);
    height: var(--icon-size);
    width: var(--icon-size);
    position: absolute;
    left: var(--gap);
    top: var(--gap);
    display: flex;
    align-items: center;
}
.XSAlert.color-default {
    border-left: 2px solid var(--color-text);
    background: var(--color-overlay-subtle);
}
.XSAlert.color-default .XSAlert-icon {
    color: var(--color-text);
}
.XSAlert.color-primary {
    border-left: 2px solid var(--color-primary);
    background: var(--color-primary-layer);
}
.XSAlert.color-primary .XSAlert-icon {
    color: var(--color-primary);
}
.XSAlert.color-success {
    border-left: 2px solid var(--color-success);
    background: var(--color-success-layer);
}
.XSAlert.color-success .XSAlert-icon {
    color: var(--color-success);
}
.XSAlert.color-danger {
    border-left: 2px solid var(--color-danger);
    background: var(--color-danger-layer);
}
.XSAlert.color-danger .XSAlert-icon {
    color: var(--color-danger);
}
.XSAlert.color-warn {
    border-left: 2px solid var(--color-warn);
    background: var(--color-warn-layer);
}
.XSAlert.color-warn .XSAlert-icon {
    color: var(--color-warn);
}
.OrderSuccessOverlay i {
  font-size: 48px;
}
.OrderSuccessOverlay .animated {
  animation-duration: 500ms !important;
}.OrderView.area {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 128px;
  height: 128px;
}.SpcCheckoutChangeCourse {
  text-align: center;
  font-weight: bold;
  font-size: var(--x-font-size-1);
  color: var(--x-color-text-secondary);
  padding: var(--x-section-gap);
}
.SpcCheckoutChangeCourse .check {
  display: flex;
  justify-content: flex-start;
}.ZoneViewMenuLayoutByCategory {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.ZoneViewMenuLayoutByCategory .products-container {
  flex: 1;
}
.ZoneViewMenuLayoutByCategory .placeholder {
  height: 58px;
}
.ZoneViewMenuLayoutByCategory .menu-product-container {
  padding: 0 var(--x-section-gap);
}
.ZoneViewMenuLayoutByCategory .menu-product-container:not(.isMenuProduct) {
  display: flex;
  align-items: center;
  font-size: var(--x-font-size-2);
  font-weight: 600;
}
.ZoneViewMenuLayoutByCategory .menu-product-container > * {
  height: calc(100% - 8px);
}html {
  --MenuProductCard-backgroundColor: var(--x-color-surface);
}

.MenuProductCard {
  position: relative;
  transition: background-color 200ms, border 200ms;
  background-color: var(--MenuProductCard-backgroundColor);
  border-radius: var(--XCard-border-radius);
  border-left: 0 solid transparent;
}
.MenuProductCard.active {
  border-left: 4px solid var(--x-color-primary);
}
.MenuProductCard.isOutOfStock {
  opacity: 0.5;
}
.MenuProductCard .description {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: var(--x-gap2);
}
.MenuProductCard .card {
  display: flex;
  align-items: center;
  position: relative;
  border-top-left-radius: var(--x-border-radius);
  transition: background-color 200ms, border 200ms;
  min-height: var(--MenuProductCardIcon-container-size);
  box-shadow: none;
}
.MenuProductCard .container-extra {
  border-bottom-left-radius: var(--x-border-radius);
  border-bottom-right-radius: var(--x-border-radius);
  margin-top: var(--x-gap2);
}
.MenuProductCard .out-of-stock {
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--x-color-surface);
  opacity: 0.9;
  z-index: 10;
  border-radius: inherit;
}
.MenuProductCard .options-container {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 9;
}
.MenuProductCard .price {
  font-weight: 600;
}
.MenuProductCard .alcohol-percent {
  font-weight: 600;
  position: absolute;
  border-radius: var(--x-border-radius);
  background-color: var(--x-color-surface);
  z-index: 8;
  padding: 2px 4px;
  font-size: var(--agFontSizeXxs);
  bottom: -2px;
  left: -2px;
  opacity: 0.85;
}
.MenuProductCard .allergen-container .icons {
  transition: transform 200ms;
  transform: translateX(0px);
}
.MenuProductCard .allergen-container.hasProducts .icons {
  transform: translateX(-68px);
}
.MenuProductCard .allergen-container.hasProducts.singleAllergen .icons {
  transform: translateX(-108px);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.MenuProductCard .AllergenDisplay {
  position: absolute;
  bottom: 6px;
  right: 6px;
  transition: 200ms;
  background-color: var(--x-color-body);
  z-index: 1;
}
.MenuProductCard.active .AllergenDisplay {
  transform: translateX(-80px);
}html {
  --UIPopup-zIndex: 1000;
}

._UIPopup_1241q_5 {
  position: fixed;
  overflow: auto;
  z-index: var(--UIPopup-zIndex);
  /* Prevent text selection */
}

._UIPopupContainer_1241q_12 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--UIPopup-zIndex);
}

@keyframes _fadeIn_1241q_1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}.MenuProductCategoryScroller {
  display: flex;
  background-color: var(--x-color-body);
  padding-left: var(--x-gap3);
  overflow: auto;
}
.MenuProductCategoryScroller ::-webkit-scrollbar {
  display: none;
}
.MenuProductCategoryScroller .category-container {
  display: flex;
  overflow: auto;
  padding-bottom: var(--x-gap2);
}
.MenuProductCategoryScroller .category-container .isActive {
  color: var(--x-color-secondary);
  border: 1px solid var(--x-color-secondary);
  font-weight: bold;
}
.MenuProductCategoryScroller .scroll-right {
  width: var(--x-size--2);
  min-width: var(--x-size--2);
  transform: translateZ(0);
}
.MenuProductCategoryScroller .scroll-right .XIcon {
  margin-right: 0;
}
.MenuProductCategoryScroller .scroll-right .gradient {
  background: linear-gradient(to right, transparent 25%, var(--x-color-body));
  height: var(--x-size--2);
  width: var(--x-size--2);
  min-width: var(--x-size--2);
  position: absolute;
  top: 0;
  left: calc(-1 * var(--x-size--2));
}
.MenuProductCategoryScroller .row::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 0;
  height: 0;
}
.MenuProductCategoryScroller .XButton {
  border: 1px solid transparent;
  height: var(--x-size--2);
  min-height: var(--x-size--2);
  font-size: var(--x-font-size-0);
  margin-right: var(--x-gap);
}
.MenuProductCategoryScroller .XButton.isActive {
  border-color: var(--x-color-secondary);
}._row_yinw1_1::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 0;
  height: 0;
}.ZoneViewMenuLayoutDefault {
  margin-bottom: calc(var(--XLayout-header-height) + var(--x-section-gap));
}html {
  --ZoneView-backgroundColor: var(--XR-Body-backgroundColor);
}

.ZoneView {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.ZoneView .image-container {
  height: 160px;
  position: fixed;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
.ZoneView .image-placeholder {
  min-height: 140px;
}
.ZoneView .outlet-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  background-color: var(--ZoneView-backgroundColor);
  border-radius: var(--border-radius-large) var(--border-radius-large) 0 0;
}
.ZoneView .outlet-name {
  position: relative;
  bottom: calc(-1 * 2 * var(--ui-spacing));
}
.ZoneView .zone-name {
  background-color: var(--ZoneView-backgroundColor);
  position: sticky;
  top: 0;
  height: var(--x-size-2);
  padding: 0 calc(2 * var(--ui-spacing) + var(--x-size-2));
}
.ZoneView .toolbar {
  position: fixed;
  z-index: var(--z-index-toolbar);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--x-size-2);
  padding-top: var(--x-gap);
  padding-left: var(--x-gap);
  width: 100%;
}
.ZoneView .toolbar .UiButton {
  height: var(--XButton-height);
  width: var(--XButton-height);
}
.ZoneView .toolbar .XButton {
  height: var(--x-size--2);
}
.ZoneView .outlet-name {
  z-index: 20;
}
.ZoneView .zone-name {
  z-index: 10;
}
.ZoneView .my-order {
  text-transform: uppercase;
  font-weight: 600;
  font-size: var(--agFontSizeSm);
  padding: 0 var(--x-gap2);
}
.ZoneView .my-order .product-count {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
  color: black;
  padding: 0 var(--x-gap);
  border-radius: var(--x-border-radius);
  font-size: var(--agFontSizeXs);
}.XSLoadingSpinner {
    --color: var(--color-text);
    --divideBy: 3;
    display: inline-block;
    position: relative;
    width: calc(80px / var(--divideBy));
    height: calc(80px / var(--divideBy));
}
.XSLoadingSpinner div {
    transform-origin: calc(40px / var(--divideBy)) calc(40px / var(--divideBy));
    animation: XSLoadingSpinner-animation 1.2s linear infinite;
}
.XSLoadingSpinner div:after {
    content: ' ';
    display: block;
    position: absolute;
    top: calc(3px / var(--divideBy));
    left: calc(37px / var(--divideBy));
    width: calc(6px / var(--divideBy));
    height: calc(18px / var(--divideBy));
    border-radius: 8px;
    background: var(--color);
}
.XSLoadingSpinner div:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -1.1s;
}
.XSLoadingSpinner div:nth-child(2) {
    transform: rotate(30deg);
    animation-delay: -1s;
}
.XSLoadingSpinner div:nth-child(3) {
    transform: rotate(60deg);
    animation-delay: -0.9s;
}
.XSLoadingSpinner div:nth-child(4) {
    transform: rotate(90deg);
    animation-delay: -0.8s;
}
.XSLoadingSpinner div:nth-child(5) {
    transform: rotate(120deg);
    animation-delay: -0.7s;
}
.XSLoadingSpinner div:nth-child(6) {
    transform: rotate(150deg);
    animation-delay: -0.6s;
}
.XSLoadingSpinner div:nth-child(7) {
    transform: rotate(180deg);
    animation-delay: -0.5s;
}
.XSLoadingSpinner div:nth-child(8) {
    transform: rotate(210deg);
    animation-delay: -0.4s;
}
.XSLoadingSpinner div:nth-child(9) {
    transform: rotate(240deg);
    animation-delay: -0.3s;
}
.XSLoadingSpinner div:nth-child(10) {
    transform: rotate(270deg);
    animation-delay: -0.2s;
}
.XSLoadingSpinner div:nth-child(11) {
    transform: rotate(300deg);
    animation-delay: -0.1s;
}
.XSLoadingSpinner div:nth-child(12) {
    transform: rotate(330deg);
    animation-delay: 0s;
}
@keyframes XSLoadingSpinner-animation {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
._root_1fkuq_1 {
  --zIndex: 1000;
}

._overlay_1fkuq_5 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  animation: _overlay_mount_1fkuq_1 0.3s forwards;
  transform: translateZ(0);
}

._overlayUnmount_1fkuq_16 {
  animation: _overlay_unmount_1fkuq_1 0.3s forwards;
}

._content_1fkuq_20 {
  --scale-from: 1;
  --translateY-from: 10%;
  position: fixed;
  bottom: env(safe-area-inset-bottom);
  z-index: 1000;
  animation: _content_mount_1fkuq_1 0.3s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

._contentUnmount_1fkuq_29 {
  animation: _content_unmount_1fkuq_1 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

._contentSize-default_1fkuq_33 {
  top: 0;
  left: 4px;
  right: 4px;
  margin: 4px auto;
  margin-top: 32px;
}
@media (max-width: 1180px) {
  ._contentSize-default_1fkuq_33 {
    max-width: 800px;
  }
}
@media (min-width: 1181px) {
  ._contentSize-default_1fkuq_33 {
    width: 1024px;
    margin-bottom: 32px;
  }
}

._contentSize-fullScreen_1fkuq_52 {
  width: 100%;
  border: 0;
  top: 0;
  left: 0;
  right: 0;
}

._showAsDrawerContent_1fkuq_60 {
  overflow: auto;
  height: calc(100% - env(safe-area-inset-bottom));
  width: min(var(--maxWidth), 100vw);
  bottom: env(safe-area-inset-bottom);
  left: calc(50% - min(var(--maxWidth), 100vw) / 2);
  transform: translateX(-50%);
}
._showAsDrawerContent_1fkuq_60 > *:nth-child(1) {
  padding-bottom: 80px;
}

._showAsDrawerCloseButtonArea_1fkuq_72 {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
  height: 80px;
  z-index: 1000;
}

@keyframes _content_mount_1fkuq_1 {
  0% {
    opacity: 0;
    transform: translateY(var(--translateY-from)) translateZ(0);
  }
  100% {
    opacity: 1;
    transform: translateY(0) translateZ(0);
  }
}
@keyframes _content_unmount_1fkuq_1 {
  0% {
    opacity: 1;
    transform: translateY(0) translateZ(0);
  }
  100% {
    opacity: 0;
    transform: translateY(var(--translateY-from)) translateZ(0);
  }
}
@keyframes _overlay_mount_1fkuq_1 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes _overlay_unmount_1fkuq_1 {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}._deviceId_l3v21_1 {
  bottom: 80px;
}

._deployedAt_l3v21_5 {
  bottom: 1px;
}

._deviceId_l3v21_1,
._deployedAt_l3v21_5 {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.5rem;
  color: var(--x-color-text-secondary);
  font-weight: bold;
  z-index: 1000;
}.OrderPlacedOverlay {
  position: fixed;
  top: var(--ui-spacing);
  right: var(--ui-spacing);
  z-index: var(--UiDialog-z-index);
  height: 0;
}
.OrderPlacedOverlay .toggle-compact {
  background-color: var(--x-color-body);
  height: 80px;
  width: 80px;
  border-radius: 100%;
  z-index: 11;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.OrderPlacedOverlay .toggle-compact i {
  font-size: 2rem;
}
.OrderPlacedOverlay .bubble-container {
  transition: transform 300ms, padding 300ms;
  transform: translateY(0px);
  position: relative;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(1) {
  transform: translateY(0px);
  z-index: 9;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(2) {
  transform: translateY(-72px);
  z-index: 8;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(3) {
  transform: translateY(-144px);
  z-index: 7;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(4) {
  transform: translateY(-216px);
  z-index: 6;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(5) {
  transform: translateY(-288px);
  z-index: 5;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(6) {
  transform: translateY(-360px);
  z-index: 4;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(7) {
  transform: translateY(-432px);
  z-index: 3;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(8) {
  transform: translateY(-504px);
  z-index: 2;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(9) {
  transform: translateY(-576px);
  z-index: 1;
}
.OrderPlacedOverlay .bubble-container.compact:nth-child(10) {
  transform: translateY(-648px);
  z-index: 0;
}
.OrderPlacedOverlay .item {
  animation-iteration-count: infinite;
  animation-duration: 1s;
  background-color: var(--x-color-surface);
  box-shadow: var(--ui-box-shadow);
  height: 80px;
  width: 80px;
  border-radius: 100%;
  overflow: hidden;
  transition: transform 300ms, padding 300ms;
  transform: translateY(0px);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 2px;
}
.OrderPlacedOverlay .item .indicator {
  animation: orderPlacedOverlaySpin 3s infinite;
  animation-timing-function: linear;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  border-left: 32px solid;
}
.OrderPlacedOverlay .item .content {
  background-color: var(--x-color-body);
  height: 100%;
  width: 100%;
  border-radius: 100%;
  z-index: 1;
  position: relative;
  transform: translateZ(0);
}
.OrderPlacedOverlay .item .content .overlay {
  height: 100%;
  width: 100%;
  background-color: var(--ui-color-overlay);
  position: absolute;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.OrderPlacedOverlay .item img {
  border-radius: 100%;
}
.OrderPlacedOverlay .item.DELIVERED .indicator {
  border-left-color: var(--x-color-success);
}
.OrderPlacedOverlay .item.PLACED .indicator {
  border-left-color: var(--ui-color-yellow);
}
.OrderPlacedOverlay .item.IN_PREPARATION .indicator {
  border-left-color: var(--x-color-success);
}
.OrderPlacedOverlay .item.order-status-ARCHIVED, .OrderPlacedOverlay .item.order-status-CANCELLED, .OrderPlacedOverlay .item.order-status-REJECTED, .OrderPlacedOverlay .item.CANCELLED, .OrderPlacedOverlay .item.allProductsDelivered, .OrderPlacedOverlay .item.READY {
  padding: 0;
}
.OrderPlacedOverlay .item.order-status-ARCHIVED .indicator, .OrderPlacedOverlay .item.order-status-CANCELLED .indicator, .OrderPlacedOverlay .item.order-status-REJECTED .indicator, .OrderPlacedOverlay .item.CANCELLED .indicator, .OrderPlacedOverlay .item.allProductsDelivered .indicator, .OrderPlacedOverlay .item.READY .indicator {
  border: none;
}
.OrderPlacedOverlay .item.order-status-ARCHIVED .overlay, .OrderPlacedOverlay .item.order-status-CANCELLED .overlay, .OrderPlacedOverlay .item.order-status-REJECTED .overlay, .OrderPlacedOverlay .item.CANCELLED .overlay, .OrderPlacedOverlay .item.allProductsDelivered .overlay, .OrderPlacedOverlay .item.READY .overlay {
  background-color: var(--x-color-success);
}
.OrderPlacedOverlay .item.CANCELLED .overlay, .OrderPlacedOverlay .item.REJECTED .overlay, .OrderPlacedOverlay .item.order-status-CANCELLED .overlay, .OrderPlacedOverlay .item.order-status-REJECTED .overlay {
  background-color: var(--x-color-error);
}

@keyframes orderPlacedOverlaySpin {
  0% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes orderPlacedOverlaySpin {
  0% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
  }
}@media (prefers-color-scheme: dark) {
    html:not([color-scheme]) {
        --xs-color-border: #333;
        --xs-color-box-shadow: black;
        --xs-layer-1-background: rgb(24, 24, 24);
        --xs-layer-1-background-hover: rgb(30, 30, 30);
        --xs-layer-1-box-shadow: none;
        --xs-layer-2-background: rgb(36, 36, 36);
        --xs-layer-2-background-hover: rgb(42, 42, 42);
        --xs-layer-2-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
        --xs-layer-3-background: rgb(48, 48, 48);
        --xs-layer-3-background-hover: rgb(54, 54, 54);
        --xs-layer-3-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
        --xs-layer-4-background: rgb(60, 60, 60);
        --xs-layer-4-background-hover: rgb(66, 66, 66);
        --xs-layer-4-box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
        --color-root-layer: rgba(127, 127, 127, 0.2);
        --color-text-reverse: black;
        --XSMask-background: rgba(0, 0, 0, 0.75);
        --XSButton-loading-spinner-background: rgba(32, 32, 32, 0.75);
        --XSButton-loading-spinner-color: var(--color-text);
        --XSButton-fill-solid-default-background: var(--color-overlay-subtle);
        --XSButton-fill-solid-default-background-hover: rgba(127, 127, 127, 0.3);
        --XSCard-background: var(--layer-0-background);
        --XSCard-border: 0;
        --XSCard-box-shadow: none;
        --XSDialog-background: rgb(12, 12, 12);
        --XSDialog-box-shadow: 0 0 0 1px var(--color-border);
        --XSInput-background: var(--color-overlay-subtle);
        --XSInput-loading-background: rgba(0, 0, 0, 0.25);
    }
    html:not([color-scheme]) .XSCard {
        background: var(--XSCard-background);
    }
    html:not([color-scheme]) .XSCard .XSCard {
        background: var(--color-overlay-subtle);
    }
    html:not([color-scheme]) .XSLayer {
        --base: 24;
        --step: 16;
        background: rgb(
            calc(0 * var(--step) + var(--base)),
            calc(0 * var(--step) + var(--base)),
            calc(0 * var(--step) + var(--base))
        );
    }
    html:not([color-scheme]) .XSLayer .XSLayer {
        background: rgb(
            calc(1 * var(--step) + var(--base)),
            calc(1 * var(--step) + var(--base)),
            calc(1 * var(--step) + var(--base))
        );
    }
    html:not([color-scheme]) .XSLayer .XSLayer .XSLayer {
        background: rgb(
            calc(2 * var(--step) + var(--base)),
            calc(2 * var(--step) + var(--base)),
            calc(2 * var(--step) + var(--base))
        );
    }
    html:not([color-scheme]) .XSLayer .XSLayer .XSLayer .XSLayer {
        background: rgb(
            calc(3 * var(--step) + var(--base)),
            calc(3 * var(--step) + var(--base)),
            calc(3 * var(--step) + var(--base))
        );
    }
    html:not([color-scheme]) .XSLayer .XSLayer .XSLayer .XSLayer .XSLayer {
        background: rgb(
            calc(4 * var(--step) + var(--base)),
            calc(4 * var(--step) + var(--base)),
            calc(4 * var(--step) + var(--base))
        );
    }
}

html:is([color-scheme='dark']) {
    --xs-color-border: #333;
    --xs-color-box-shadow: black;
    --xs-layer-1-background: rgb(24, 24, 24);
    --xs-layer-1-background-hover: rgb(30, 30, 30);
    --xs-layer-1-box-shadow: none;
    --xs-layer-2-background: rgb(36, 36, 36);
    --xs-layer-2-background-hover: rgb(42, 42, 42);
    --xs-layer-2-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --xs-layer-3-background: rgb(48, 48, 48);
    --xs-layer-3-background-hover: rgb(54, 54, 54);
    --xs-layer-3-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
    --xs-layer-4-background: rgb(60, 60, 60);
    --xs-layer-4-background-hover: rgb(66, 66, 66);
    --xs-layer-4-box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    --color-root-layer: rgba(127, 127, 127, 0.2);
    --color-text-reverse: black;
    --XSMask-background: rgba(0, 0, 0, 0.75);
    --XSButton-loading-spinner-background: rgba(32, 32, 32, 0.75);
    --XSButton-loading-spinner-color: var(--color-text);
    --XSButton-fill-solid-default-background: var(--color-overlay-subtle);
    --XSButton-fill-solid-default-background-hover: rgba(127, 127, 127, 0.3);
    --XSCard-background: var(--layer-0-background);
    --XSCard-border: 0;
    --XSCard-box-shadow: none;
    --XSDialog-background: rgb(12, 12, 12);
    --XSDialog-box-shadow: 0 0 0 1px var(--color-border);
    --XSInput-background: var(--color-overlay-subtle);
    --XSInput-loading-background: rgba(0, 0, 0, 0.25);
}
html:is([color-scheme='dark']) .XSCard {
    background: var(--XSCard-background);
}
html:is([color-scheme='dark']) .XSCard .XSCard {
    background: var(--color-overlay-subtle);
}
html:is([color-scheme='dark']) .XSLayer {
    --base: 24;
    --step: 16;
    background: rgb(
        calc(0 * var(--step) + var(--base)),
        calc(0 * var(--step) + var(--base)),
        calc(0 * var(--step) + var(--base))
    );
}
html:is([color-scheme='dark']) .XSLayer .XSLayer {
    background: rgb(
        calc(1 * var(--step) + var(--base)),
        calc(1 * var(--step) + var(--base)),
        calc(1 * var(--step) + var(--base))
    );
}
html:is([color-scheme='dark']) .XSLayer .XSLayer .XSLayer {
    background: rgb(
        calc(2 * var(--step) + var(--base)),
        calc(2 * var(--step) + var(--base)),
        calc(2 * var(--step) + var(--base))
    );
}
html:is([color-scheme='dark']) .XSLayer .XSLayer .XSLayer .XSLayer {
    background: rgb(
        calc(3 * var(--step) + var(--base)),
        calc(3 * var(--step) + var(--base)),
        calc(3 * var(--step) + var(--base))
    );
}
html:is([color-scheme='dark']) .XSLayer .XSLayer .XSLayer .XSLayer .XSLayer {
    background: rgb(
        calc(4 * var(--step) + var(--base)),
        calc(4 * var(--step) + var(--base)),
        calc(4 * var(--step) + var(--base))
    );
}

@media (prefers-color-scheme: light) {
    html:not([color-scheme]) {
        --xs-color-border: #d3d3d3;
        --xs-color-box-shadow: #ccc;
        --xs-layer-1-background: white;
        --xs-layer-1-background-hover: var(--xs-layer-1-background);
        --xs-layer-1-box-shadow: 0 0 4px rgb(210, 210, 210);
        --xs-layer-2-background: var(--xs-layer-1-background);
        --xs-layer-2-background-hover: var(--xs-layer-1-background);
        --xs-layer-2-box-shadow: var(--xs-layer-1-box-shadow);
        --xs-layer-3-background: var(--xs-layer-1-background);
        --xs-layer-3-background-hover: var(--xs-layer-1-background);
        --xs-layer-3-box-shadow: var(--xs-layer-1-box-shadow);
        --xs-layer-4-background: var(--xs-layer-1-background);
        --xs-layer-4-background-hover: var(--xs-layer-1-background);
        --xs-layer-4-box-shadow: var(--xs-layer-1-box-shadow);
        --color-root-layer: rgba(127, 127, 127, 0.05);
        --color-text-reverse: white;
        --XSMask-background: rgba(0, 0, 0, 0.5);
        --XSButton-loading-spinner-background: rgba(255, 255, 255, 0.8);
        --XSButton-loading-spinner-color: grey;
        --XSButton-fill-solid-default-background: rgba(127, 127, 127, 0.1);
        --XSButton-fill-solid-default-background-hover: rgba(127, 127, 127, 0.15);
        --XSCard-background: white;
        --XSCard-border: 1px solid var(--color-border);
        --XSCard-box-shadow: 0 0 4px rgb(210, 210, 210);
        --XSDialog-background: var(--color-root);
        --XSDialog-box-shadow: none;
        --XSInput-background: var(--color-root);
        --XSInput-border: 1px solid var(--color-border);
        --XSInput-loading-background: rgba(255, 255, 255, 0.75);
    }
    html:not([color-scheme]) .XSLayer {
        background: white;
    }
}

html:is([color-scheme='light']) {
    --xs-color-border: #d3d3d3;
    --xs-color-box-shadow: #ccc;
    --xs-layer-1-background: white;
    --xs-layer-1-background-hover: var(--xs-layer-1-background);
    --xs-layer-1-box-shadow: 0 0 4px rgb(210, 210, 210);
    --xs-layer-2-background: var(--xs-layer-1-background);
    --xs-layer-2-background-hover: var(--xs-layer-1-background);
    --xs-layer-2-box-shadow: var(--xs-layer-1-box-shadow);
    --xs-layer-3-background: var(--xs-layer-1-background);
    --xs-layer-3-background-hover: var(--xs-layer-1-background);
    --xs-layer-3-box-shadow: var(--xs-layer-1-box-shadow);
    --xs-layer-4-background: var(--xs-layer-1-background);
    --xs-layer-4-background-hover: var(--xs-layer-1-background);
    --xs-layer-4-box-shadow: var(--xs-layer-1-box-shadow);
    --color-root-layer: rgba(127, 127, 127, 0.05);
    --color-text-reverse: white;
    --XSMask-background: rgba(0, 0, 0, 0.5);
    --XSButton-loading-spinner-background: rgba(255, 255, 255, 0.8);
    --XSButton-loading-spinner-color: grey;
    --XSButton-fill-solid-default-background: rgba(127, 127, 127, 0.1);
    --XSButton-fill-solid-default-background-hover: rgba(127, 127, 127, 0.15);
    --XSCard-background: white;
    --XSCard-border: 1px solid var(--color-border);
    --XSCard-box-shadow: 0 0 4px rgb(210, 210, 210);
    --XSDialog-background: var(--color-root);
    --XSDialog-box-shadow: none;
    --XSInput-background: var(--color-root);
    --XSInput-border: 1px solid var(--color-border);
    --XSInput-loading-background: rgba(255, 255, 255, 0.75);
}
html:is([color-scheme='light']) .XSLayer {
    background: white;
}

html {
    --xs-border-radius: 12px;
    --xs-margin-block: 12px;
    --xs-size-control: 48px;
    --blur: blur(12px);
    --z-index-mask: 1000;
    --textSize-md-xs: var(--agFontSizeXs);
    --textSize-md-default: var(--agFontSizeMd);
    --XSCard-border-radius: 10px;
    --XSInput-border-radius: 8px;
    --XSSection-gap: 12px;
    --XSText-label-font-size: var(--agFontSizeXs);
    --XSText-label-letter-spacing: 1px;
}
html.admin,
html.admin-v1 {
    --xs-size-control: 40px;
}

body {
    margin: 0;
}

* {
    box-sizing: border-box;
}