@font-face {
    font-family: icomoon;
    src: url(icomoon.59d04e43b778981e72e1.eot?i3bhh8);
    src: url(icomoon.59d04e43b778981e72e1.eot?i3bhh8#iefix) format("embedded-opentype"), url(icomoon.0b3ffbfccd0cecf172e1.ttf?i3bhh8) format("truetype"), url(icomoon.35b30cc4edcf5d4a72e1.woff?i3bhh8) format("woff"), url(icomoon.92e93b8a9d00600972e1.svg?i3bhh8#icomoon) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: block
}

[class^=icomoon-], [class*=" icomoon-"] {
    font-family: icomoon !important;
    speak: never;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icomoon-block:before {
    content: "\e938"
}

.icomoon-zoom-in:before {
    content: "\e931"
}

.icomoon-arweave:before {
    content: "\e932"
}

.icomoon-iaas .path1:before {
    content: "\e933";
    color: #000
}

.icomoon-iaas .path2:before {
    content: "\e934";
    margin-left: -1.3330078125em;
    color: #000
}

.icomoon-iaas .path3:before {
    content: "\e935";
    margin-left: -1.3330078125em;
    color: #000
}

.icomoon-iaas .path4:before {
    content: "\e936";
    margin-left: -1.3330078125em;
    color: #d5d931
}

.icomoon-x:before {
    content: "\e93b"
}

.icomoon-facebook:before {
    content: "\e91f"
}

.icomoon-linkedin:before {
    content: "\e920"
}

.icomoon-reddit:before {
    content: "\e929"
}

.icomoon-github:before {
    content: "\e92a"
}

.icomoon-twitter:before {
    content: "\e92b"
}

.icomoon-telegram:before {
    content: "\e92c"
}

.icomoon-discord:before {
    content: "\e92d"
}

.icomoon-medium:before {
    content: "\e92e"
}

.icomoon-debridge:before {
    content: "\e93f"
}

.icomoon-import:before {
    content: "\e93d"
}

.icomoon-export:before {
    content: "\e93e"
}

.icomoon-alert:before {
    content: "\e93c"
}

.icomoon-fees:before {
    content: "\e939"
}

.icomoon-transfers:before {
    content: "\e93a"
}

.icomoon-star-fill:before {
    content: "\e937"
}

.icomoon-rss:before {
    content: "\e930"
}

.icomoon-dbr:before {
    content: "\e92f"
}

.icomoon-cup:before {
    content: "\e91e"
}

.icomoon-more-horizontal:before {
    content: "\e91b"
}

.icomoon-more-vertical:before {
    content: "\e91d"
}

.icomoon-sign-out:before {
    content: "\e900"
}

.icomoon-menu:before {
    content: "\e901"
}

.icomoon-chevron-left:before {
    content: "\e902"
}

.icomoon-chevron-right:before {
    content: "\e903"
}

.icomoon-chart-bar:before {
    content: "\e904"
}

.icomoon-user:before {
    content: "\e905"
}

.icomoon-users:before {
    content: "\e906"
}

.icomoon-arrow-left-right:before {
    content: "\e907"
}

.icomoon-inbox:before {
    content: "\e908"
}

.icomoon-shield:before {
    content: "\e909"
}

.icomoon-loader:before {
    content: "\e90a"
}

.icomoon-star:before {
    content: "\e90b"
}

.icomoon-close:before {
    content: "\e90c"
}

.icomoon-trash:before {
    content: "\e90d"
}

.icomoon-unlock:before {
    content: "\e90e"
}

.icomoon-lock:before {
    content: "\e90f"
}

.icomoon-info:before {
    content: "\e910"
}

.icomoon-settings:before {
    content: "\e911"
}

.icomoon-arrow-down-up:before {
    content: "\e912"
}

.icomoon-swap:before {
    content: "\e913"
}

.icomoon-arrow-down:before {
    content: "\e914"
}

.icomoon-minus:before {
    content: "\e915"
}

.icomoon-plus:before {
    content: "\e916"
}

.icomoon-clock:before {
    content: "\e917"
}

.icomoon-check:before {
    content: "\e918"
}

.icomoon-wallet:before {
    content: "\e919"
}

.icomoon-wallet-2:before {
    content: "\e91a"
}

.icomoon-sun:before {
    content: "\e91c"
}

.icomoon-reload:before {
    content: "\e921"
}

.icomoon-arrow-top-right:before {
    content: "\e922"
}

.icomoon-search:before {
    content: "\e923"
}

.icomoon-copy:before {
    content: "\e924"
}

.icomoon-arrow-right:before {
    content: "\e925"
}

.icomoon-arrow-left:before {
    content: "\e926"
}

.icomoon-chevron-up:before {
    content: "\e927"
}

.icomoon-chevron-down:before {
    content: "\e928"
}

@font-face {
    font-family: Material Icons;
    font-style: normal;
    font-weight: 400;
    src: local("Material Icons"), url(MaterialIcons-Regular.3c1e8444e7adc543.woff2) format("woff2"), url(MaterialIcons-Regular.8dfc6e3c203455a3.ttf) format("truetype")
}

.material-icons {
    font-family: Material Icons;
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    font-display: block;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "liga"
}

.mat-ripple {
    overflow: hidden;
    position: relative
}

.mat-ripple:not(:empty) {
    transform: translateZ(0)
}

.mat-ripple.mat-ripple-unbounded {
    overflow: visible
}

.mat-ripple-element {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    transition: opacity, transform 0ms cubic-bezier(0, 0, .2, 1);
    transform: scale3d(0, 0, 0)
}

.cdk-high-contrast-active .mat-ripple-element {
    display: none
}

.cdk-visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    left: 0
}

[dir=rtl] .cdk-visually-hidden {
    left: auto;
    right: 0
}

.cdk-overlay-container, .cdk-global-overlay-wrapper {
    pointer-events: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.cdk-overlay-container {
    position: fixed;
    z-index: 1000
}

.cdk-overlay-container:empty {
    display: none
}

.cdk-global-overlay-wrapper {
    display: flex;
    position: absolute;
    z-index: 1000
}

.cdk-overlay-pane {
    position: absolute;
    pointer-events: auto;
    box-sizing: border-box;
    z-index: 1000;
    display: flex;
    max-width: 100%;
    max-height: 100%
}

.cdk-overlay-backdrop {
    position: absolute;
    inset: 0;
    z-index: 1000;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
    transition: opacity .4s cubic-bezier(.25, .8, .25, 1);
    opacity: 0
}

.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
    opacity: 1
}

.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
    opacity: .6
}

.cdk-overlay-dark-backdrop {
    background: rgba(0, 0, 0, .32)
}

.cdk-overlay-transparent-backdrop {
    transition: visibility 1ms linear, opacity 1ms linear;
    visibility: hidden;
    opacity: 1
}

.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
    opacity: 0;
    visibility: visible
}

.cdk-overlay-backdrop-noop-animation {
    transition: none
}

.cdk-overlay-connected-position-bounding-box {
    position: absolute;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    min-width: 1px;
    min-height: 1px
}

.cdk-global-scrollblock {
    position: fixed;
    width: 100%;
    overflow-y: scroll
}

textarea.cdk-textarea-autosize {
    resize: none
}

textarea.cdk-textarea-autosize-measuring {
    padding: 2px 0 !important;
    box-sizing: content-box !important;
    height: auto !important;
    overflow: hidden !important
}

textarea.cdk-textarea-autosize-measuring-firefox {
    padding: 2px 0 !important;
    box-sizing: content-box !important;
    height: 0 !important
}

@keyframes cdk-text-field-autofill-start {}

@keyframes cdk-text-field-autofill-end {}

.cdk-text-field-autofill-monitored:-webkit-autofill {
    animation: cdk-text-field-autofill-start 0s 1ms
}

.cdk-text-field-autofill-monitored:not(:-webkit-autofill) {
    animation: cdk-text-field-autofill-end 0s 1ms
}

.mat-focus-indicator {
    position: relative
}

.mat-focus-indicator:before {
    inset: 0;
    position: absolute;
    box-sizing: border-box;
    pointer-events: none;
    display: var(--mat-focus-indicator-display, none);
    border: var(--mat-focus-indicator-border-width, 3px) var(--mat-focus-indicator-border-style, solid) var(--mat-focus-indicator-border-color, transparent);
    border-radius: var(--mat-focus-indicator-border-radius, 4px)
}

.mat-focus-indicator:focus:before {
    content: ""
}

.cdk-high-contrast-active {
    --mat-focus-indicator-display: block
}

.mat-mdc-focus-indicator {
    position: relative
}

.mat-mdc-focus-indicator:before {
    inset: 0;
    position: absolute;
    box-sizing: border-box;
    pointer-events: none;
    display: var(--mat-mdc-focus-indicator-display, none);
    border: var(--mat-mdc-focus-indicator-border-width, 3px) var(--mat-mdc-focus-indicator-border-style, solid) var(--mat-mdc-focus-indicator-border-color, transparent);
    border-radius: var(--mat-mdc-focus-indicator-border-radius, 4px)
}

.mat-mdc-focus-indicator:focus:before {
    content: ""
}

.cdk-high-contrast-active {
    --mat-mdc-focus-indicator-display: block
}

:root {
    --aspect-ratio: 100%
}

.p-0 {
    padding: 0 !important
}

.px-0 {
    padding-right: 0 !important;
    padding-left: 0 !important
}

.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.m-0 {
    margin: 0 !important
}

.mx-0 {
    margin-right: 0 !important;
    margin-left: 0 !important
}

.my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important
}

.p-1 {
    padding: .3334rem !important
}

.px-1 {
    padding-right: .3334rem !important;
    padding-left: .3334rem !important
}

.py-1 {
    padding-top: .3334rem !important;
    padding-bottom: .3334rem !important
}

.m-1 {
    margin: .3334rem !important
}

.mx-1 {
    margin-right: .3334rem !important;
    margin-left: .3334rem !important
}

.my-1 {
    margin-top: .3334rem !important;
    margin-bottom: .3334rem !important
}

.p-2 {
    padding: .6667rem !important
}

.px-2 {
    padding-right: .6667rem !important;
    padding-left: .6667rem !important
}

.py-2 {
    padding-top: .6667rem !important;
    padding-bottom: .6667rem !important
}

.m-2 {
    margin: .6667rem !important
}

.mx-2 {
    margin-right: .6667rem !important;
    margin-left: .6667rem !important
}

.my-2 {
    margin-top: .6667rem !important;
    margin-bottom: .6667rem !important
}

.p-3 {
    padding: 1rem !important
}

.px-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important
}

.py-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important
}

.m-3 {
    margin: 1rem !important
}

.mx-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important
}

.my-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important
}

.p-4 {
    padding: 1.3334rem !important
}

.px-4 {
    padding-right: 1.3334rem !important;
    padding-left: 1.3334rem !important
}

.py-4 {
    padding-top: 1.3334rem !important;
    padding-bottom: 1.3334rem !important
}

.m-4 {
    margin: 1.3334rem !important
}

.mx-4 {
    margin-right: 1.3334rem !important;
    margin-left: 1.3334rem !important
}

.my-4 {
    margin-top: 1.3334rem !important;
    margin-bottom: 1.3334rem !important
}

.p-5 {
    padding: 2rem !important
}

.px-5 {
    padding-right: 2rem !important;
    padding-left: 2rem !important
}

.py-5 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important
}

.m-5 {
    margin: 2rem !important
}

.mx-5 {
    margin-right: 2rem !important;
    margin-left: 2rem !important
}

.my-5 {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important
}

.p-6 {
    padding: 3rem !important
}

.px-6 {
    padding-right: 3rem !important;
    padding-left: 3rem !important
}

.py-6 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important
}

.m-6 {
    margin: 3rem !important
}

.mx-6 {
    margin-right: 3rem !important;
    margin-left: 3rem !important
}

.my-6 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important
}

.p-auto {
    padding: auto !important
}

.px-auto {
    padding-right: auto !important;
    padding-left: auto !important
}

.py-auto {
    padding-top: auto !important;
    padding-bottom: auto !important
}

.m-auto {
    margin: auto !important
}

.mx-auto {
    margin-right: auto !important;
    margin-left: auto !important
}

.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important
}

.pt-0 {
    padding-top: 0 !important
}

.pe-0 {
    padding-right: 0 !important
}

.pb-0 {
    padding-bottom: 0 !important
}

.ps-0 {
    padding-left: 0 !important
}

.mt-0 {
    margin-top: 0 !important
}

.me-0 {
    margin-right: 0 !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.ms-0 {
    margin-left: 0 !important
}

.pt-1 {
    padding-top: .3334rem !important
}

.pe-1 {
    padding-right: .3334rem !important
}

.pb-1 {
    padding-bottom: .3334rem !important
}

.ps-1 {
    padding-left: .3334rem !important
}

.mt-1 {
    margin-top: .3334rem !important
}

.me-1 {
    margin-right: .3334rem !important
}

.mb-1 {
    margin-bottom: .3334rem !important
}

.ms-1 {
    margin-left: .3334rem !important
}

.pt-2 {
    padding-top: .6667rem !important
}

.pe-2 {
    padding-right: .6667rem !important
}

.pb-2 {
    padding-bottom: .6667rem !important
}

.ps-2 {
    padding-left: .6667rem !important
}

.mt-2 {
    margin-top: .6667rem !important
}

.me-2 {
    margin-right: .6667rem !important
}

.mb-2 {
    margin-bottom: .6667rem !important
}

.ms-2 {
    margin-left: .6667rem !important
}

.pt-3 {
    padding-top: 1rem !important
}

.pe-3 {
    padding-right: 1rem !important
}

.pb-3 {
    padding-bottom: 1rem !important
}

.ps-3 {
    padding-left: 1rem !important
}

.mt-3 {
    margin-top: 1rem !important
}

.me-3 {
    margin-right: 1rem !important
}

.mb-3 {
    margin-bottom: 1rem !important
}

.ms-3 {
    margin-left: 1rem !important
}

.pt-4 {
    padding-top: 1.3334rem !important
}

.pe-4 {
    padding-right: 1.3334rem !important
}

.pb-4 {
    padding-bottom: 1.3334rem !important
}

.ps-4 {
    padding-left: 1.3334rem !important
}

.mt-4 {
    margin-top: 1.3334rem !important
}

.me-4 {
    margin-right: 1.3334rem !important
}

.mb-4 {
    margin-bottom: 1.3334rem !important
}

.ms-4 {
    margin-left: 1.3334rem !important
}

.pt-5 {
    padding-top: 2rem !important
}

.pe-5 {
    padding-right: 2rem !important
}

.pb-5 {
    padding-bottom: 2rem !important
}

.ps-5 {
    padding-left: 2rem !important
}

.mt-5 {
    margin-top: 2rem !important
}

.me-5 {
    margin-right: 2rem !important
}

.mb-5 {
    margin-bottom: 2rem !important
}

.ms-5 {
    margin-left: 2rem !important
}

.pt-6 {
    padding-top: 3rem !important
}

.pe-6 {
    padding-right: 3rem !important
}

.pb-6 {
    padding-bottom: 3rem !important
}

.ps-6 {
    padding-left: 3rem !important
}

.mt-6 {
    margin-top: 3rem !important
}

.me-6 {
    margin-right: 3rem !important
}

.mb-6 {
    margin-bottom: 3rem !important
}

.ms-6 {
    margin-left: 3rem !important
}

.pt-auto {
    padding-top: auto !important
}

.pe-auto {
    padding-right: auto !important
}

.pb-auto {
    padding-bottom: auto !important
}

.ps-auto {
    padding-left: auto !important
}

.mt-auto {
    margin-top: auto !important
}

.me-auto {
    margin-right: auto !important
}

.mb-auto {
    margin-bottom: auto !important
}

.ms-auto {
    margin-left: auto !important
}

@media (min-width: 576px) {
    .p-sm-0 {
        padding: 0 !important
    }

    .px-sm-0 {
        padding-right: 0 !important;
        padding-left: 0 !important
    }

    .py-sm-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .m-sm-0 {
        margin: 0 !important
    }

    .mx-sm-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-sm-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .p-sm-1 {
        padding: .3334rem !important
    }

    .px-sm-1 {
        padding-right: .3334rem !important;
        padding-left: .3334rem !important
    }

    .py-sm-1 {
        padding-top: .3334rem !important;
        padding-bottom: .3334rem !important
    }

    .m-sm-1 {
        margin: .3334rem !important
    }

    .mx-sm-1 {
        margin-right: .3334rem !important;
        margin-left: .3334rem !important
    }

    .my-sm-1 {
        margin-top: .3334rem !important;
        margin-bottom: .3334rem !important
    }

    .p-sm-2 {
        padding: .6667rem !important
    }

    .px-sm-2 {
        padding-right: .6667rem !important;
        padding-left: .6667rem !important
    }

    .py-sm-2 {
        padding-top: .6667rem !important;
        padding-bottom: .6667rem !important
    }

    .m-sm-2 {
        margin: .6667rem !important
    }

    .mx-sm-2 {
        margin-right: .6667rem !important;
        margin-left: .6667rem !important
    }

    .my-sm-2 {
        margin-top: .6667rem !important;
        margin-bottom: .6667rem !important
    }

    .p-sm-3 {
        padding: 1rem !important
    }

    .px-sm-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-sm-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .m-sm-3 {
        margin: 1rem !important
    }

    .mx-sm-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-sm-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .p-sm-4 {
        padding: 1.3334rem !important
    }

    .px-sm-4 {
        padding-right: 1.3334rem !important;
        padding-left: 1.3334rem !important
    }

    .py-sm-4 {
        padding-top: 1.3334rem !important;
        padding-bottom: 1.3334rem !important
    }

    .m-sm-4 {
        margin: 1.3334rem !important
    }

    .mx-sm-4 {
        margin-right: 1.3334rem !important;
        margin-left: 1.3334rem !important
    }

    .my-sm-4 {
        margin-top: 1.3334rem !important;
        margin-bottom: 1.3334rem !important
    }

    .p-sm-5 {
        padding: 2rem !important
    }

    .px-sm-5 {
        padding-right: 2rem !important;
        padding-left: 2rem !important
    }

    .py-sm-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important
    }

    .m-sm-5 {
        margin: 2rem !important
    }

    .mx-sm-5 {
        margin-right: 2rem !important;
        margin-left: 2rem !important
    }

    .my-sm-5 {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important
    }

    .p-sm-6 {
        padding: 3rem !important
    }

    .px-sm-6 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-sm-6 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-sm-6 {
        margin: 3rem !important
    }

    .mx-sm-6 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-sm-6 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-sm-auto {
        padding: auto !important
    }

    .px-sm-auto {
        padding-right: auto !important;
        padding-left: auto !important
    }

    .py-sm-auto {
        padding-top: auto !important;
        padding-bottom: auto !important
    }

    .m-sm-auto {
        margin: auto !important
    }

    .mx-sm-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-sm-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }

    .pt-sm-0 {
        padding-top: 0 !important
    }

    .pe-sm-0 {
        padding-right: 0 !important
    }

    .pb-sm-0 {
        padding-bottom: 0 !important
    }

    .ps-sm-0 {
        padding-left: 0 !important
    }

    .mt-sm-0 {
        margin-top: 0 !important
    }

    .me-sm-0 {
        margin-right: 0 !important
    }

    .mb-sm-0 {
        margin-bottom: 0 !important
    }

    .ms-sm-0 {
        margin-left: 0 !important
    }

    .pt-sm-1 {
        padding-top: .3334rem !important
    }

    .pe-sm-1 {
        padding-right: .3334rem !important
    }

    .pb-sm-1 {
        padding-bottom: .3334rem !important
    }

    .ps-sm-1 {
        padding-left: .3334rem !important
    }

    .mt-sm-1 {
        margin-top: .3334rem !important
    }

    .me-sm-1 {
        margin-right: .3334rem !important
    }

    .mb-sm-1 {
        margin-bottom: .3334rem !important
    }

    .ms-sm-1 {
        margin-left: .3334rem !important
    }

    .pt-sm-2 {
        padding-top: .6667rem !important
    }

    .pe-sm-2 {
        padding-right: .6667rem !important
    }

    .pb-sm-2 {
        padding-bottom: .6667rem !important
    }

    .ps-sm-2 {
        padding-left: .6667rem !important
    }

    .mt-sm-2 {
        margin-top: .6667rem !important
    }

    .me-sm-2 {
        margin-right: .6667rem !important
    }

    .mb-sm-2 {
        margin-bottom: .6667rem !important
    }

    .ms-sm-2 {
        margin-left: .6667rem !important
    }

    .pt-sm-3 {
        padding-top: 1rem !important
    }

    .pe-sm-3 {
        padding-right: 1rem !important
    }

    .pb-sm-3 {
        padding-bottom: 1rem !important
    }

    .ps-sm-3 {
        padding-left: 1rem !important
    }

    .mt-sm-3 {
        margin-top: 1rem !important
    }

    .me-sm-3 {
        margin-right: 1rem !important
    }

    .mb-sm-3 {
        margin-bottom: 1rem !important
    }

    .ms-sm-3 {
        margin-left: 1rem !important
    }

    .pt-sm-4 {
        padding-top: 1.3334rem !important
    }

    .pe-sm-4 {
        padding-right: 1.3334rem !important
    }

    .pb-sm-4 {
        padding-bottom: 1.3334rem !important
    }

    .ps-sm-4 {
        padding-left: 1.3334rem !important
    }

    .mt-sm-4 {
        margin-top: 1.3334rem !important
    }

    .me-sm-4 {
        margin-right: 1.3334rem !important
    }

    .mb-sm-4 {
        margin-bottom: 1.3334rem !important
    }

    .ms-sm-4 {
        margin-left: 1.3334rem !important
    }

    .pt-sm-5 {
        padding-top: 2rem !important
    }

    .pe-sm-5 {
        padding-right: 2rem !important
    }

    .pb-sm-5 {
        padding-bottom: 2rem !important
    }

    .ps-sm-5 {
        padding-left: 2rem !important
    }

    .mt-sm-5 {
        margin-top: 2rem !important
    }

    .me-sm-5 {
        margin-right: 2rem !important
    }

    .mb-sm-5 {
        margin-bottom: 2rem !important
    }

    .ms-sm-5 {
        margin-left: 2rem !important
    }

    .pt-sm-6 {
        padding-top: 3rem !important
    }

    .pe-sm-6 {
        padding-right: 3rem !important
    }

    .pb-sm-6 {
        padding-bottom: 3rem !important
    }

    .ps-sm-6 {
        padding-left: 3rem !important
    }

    .mt-sm-6 {
        margin-top: 3rem !important
    }

    .me-sm-6 {
        margin-right: 3rem !important
    }

    .mb-sm-6 {
        margin-bottom: 3rem !important
    }

    .ms-sm-6 {
        margin-left: 3rem !important
    }

    .pt-sm-auto {
        padding-top: auto !important
    }

    .pe-sm-auto {
        padding-right: auto !important
    }

    .pb-sm-auto {
        padding-bottom: auto !important
    }

    .ps-sm-auto {
        padding-left: auto !important
    }

    .mt-sm-auto {
        margin-top: auto !important
    }

    .me-sm-auto {
        margin-right: auto !important
    }

    .mb-sm-auto {
        margin-bottom: auto !important
    }

    .ms-sm-auto {
        margin-left: auto !important
    }
}

@media (min-width: 768px) {
    .p-md-0 {
        padding: 0 !important
    }

    .px-md-0 {
        padding-right: 0 !important;
        padding-left: 0 !important
    }

    .py-md-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .m-md-0 {
        margin: 0 !important
    }

    .mx-md-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-md-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .p-md-1 {
        padding: .3334rem !important
    }

    .px-md-1 {
        padding-right: .3334rem !important;
        padding-left: .3334rem !important
    }

    .py-md-1 {
        padding-top: .3334rem !important;
        padding-bottom: .3334rem !important
    }

    .m-md-1 {
        margin: .3334rem !important
    }

    .mx-md-1 {
        margin-right: .3334rem !important;
        margin-left: .3334rem !important
    }

    .my-md-1 {
        margin-top: .3334rem !important;
        margin-bottom: .3334rem !important
    }

    .p-md-2 {
        padding: .6667rem !important
    }

    .px-md-2 {
        padding-right: .6667rem !important;
        padding-left: .6667rem !important
    }

    .py-md-2 {
        padding-top: .6667rem !important;
        padding-bottom: .6667rem !important
    }

    .m-md-2 {
        margin: .6667rem !important
    }

    .mx-md-2 {
        margin-right: .6667rem !important;
        margin-left: .6667rem !important
    }

    .my-md-2 {
        margin-top: .6667rem !important;
        margin-bottom: .6667rem !important
    }

    .p-md-3 {
        padding: 1rem !important
    }

    .px-md-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-md-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .m-md-3 {
        margin: 1rem !important
    }

    .mx-md-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-md-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .p-md-4 {
        padding: 1.3334rem !important
    }

    .px-md-4 {
        padding-right: 1.3334rem !important;
        padding-left: 1.3334rem !important
    }

    .py-md-4 {
        padding-top: 1.3334rem !important;
        padding-bottom: 1.3334rem !important
    }

    .m-md-4 {
        margin: 1.3334rem !important
    }

    .mx-md-4 {
        margin-right: 1.3334rem !important;
        margin-left: 1.3334rem !important
    }

    .my-md-4 {
        margin-top: 1.3334rem !important;
        margin-bottom: 1.3334rem !important
    }

    .p-md-5 {
        padding: 2rem !important
    }

    .px-md-5 {
        padding-right: 2rem !important;
        padding-left: 2rem !important
    }

    .py-md-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important
    }

    .m-md-5 {
        margin: 2rem !important
    }

    .mx-md-5 {
        margin-right: 2rem !important;
        margin-left: 2rem !important
    }

    .my-md-5 {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important
    }

    .p-md-6 {
        padding: 3rem !important
    }

    .px-md-6 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-md-6 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-md-6 {
        margin: 3rem !important
    }

    .mx-md-6 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-md-6 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-md-auto {
        padding: auto !important
    }

    .px-md-auto {
        padding-right: auto !important;
        padding-left: auto !important
    }

    .py-md-auto {
        padding-top: auto !important;
        padding-bottom: auto !important
    }

    .m-md-auto {
        margin: auto !important
    }

    .mx-md-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-md-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }

    .pt-md-0 {
        padding-top: 0 !important
    }

    .pe-md-0 {
        padding-right: 0 !important
    }

    .pb-md-0 {
        padding-bottom: 0 !important
    }

    .ps-md-0 {
        padding-left: 0 !important
    }

    .mt-md-0 {
        margin-top: 0 !important
    }

    .me-md-0 {
        margin-right: 0 !important
    }

    .mb-md-0 {
        margin-bottom: 0 !important
    }

    .ms-md-0 {
        margin-left: 0 !important
    }

    .pt-md-1 {
        padding-top: .3334rem !important
    }

    .pe-md-1 {
        padding-right: .3334rem !important
    }

    .pb-md-1 {
        padding-bottom: .3334rem !important
    }

    .ps-md-1 {
        padding-left: .3334rem !important
    }

    .mt-md-1 {
        margin-top: .3334rem !important
    }

    .me-md-1 {
        margin-right: .3334rem !important
    }

    .mb-md-1 {
        margin-bottom: .3334rem !important
    }

    .ms-md-1 {
        margin-left: .3334rem !important
    }

    .pt-md-2 {
        padding-top: .6667rem !important
    }

    .pe-md-2 {
        padding-right: .6667rem !important
    }

    .pb-md-2 {
        padding-bottom: .6667rem !important
    }

    .ps-md-2 {
        padding-left: .6667rem !important
    }

    .mt-md-2 {
        margin-top: .6667rem !important
    }

    .me-md-2 {
        margin-right: .6667rem !important
    }

    .mb-md-2 {
        margin-bottom: .6667rem !important
    }

    .ms-md-2 {
        margin-left: .6667rem !important
    }

    .pt-md-3 {
        padding-top: 1rem !important
    }

    .pe-md-3 {
        padding-right: 1rem !important
    }

    .pb-md-3 {
        padding-bottom: 1rem !important
    }

    .ps-md-3 {
        padding-left: 1rem !important
    }

    .mt-md-3 {
        margin-top: 1rem !important
    }

    .me-md-3 {
        margin-right: 1rem !important
    }

    .mb-md-3 {
        margin-bottom: 1rem !important
    }

    .ms-md-3 {
        margin-left: 1rem !important
    }

    .pt-md-4 {
        padding-top: 1.3334rem !important
    }

    .pe-md-4 {
        padding-right: 1.3334rem !important
    }

    .pb-md-4 {
        padding-bottom: 1.3334rem !important
    }

    .ps-md-4 {
        padding-left: 1.3334rem !important
    }

    .mt-md-4 {
        margin-top: 1.3334rem !important
    }

    .me-md-4 {
        margin-right: 1.3334rem !important
    }

    .mb-md-4 {
        margin-bottom: 1.3334rem !important
    }

    .ms-md-4 {
        margin-left: 1.3334rem !important
    }

    .pt-md-5 {
        padding-top: 2rem !important
    }

    .pe-md-5 {
        padding-right: 2rem !important
    }

    .pb-md-5 {
        padding-bottom: 2rem !important
    }

    .ps-md-5 {
        padding-left: 2rem !important
    }

    .mt-md-5 {
        margin-top: 2rem !important
    }

    .me-md-5 {
        margin-right: 2rem !important
    }

    .mb-md-5 {
        margin-bottom: 2rem !important
    }

    .ms-md-5 {
        margin-left: 2rem !important
    }

    .pt-md-6 {
        padding-top: 3rem !important
    }

    .pe-md-6 {
        padding-right: 3rem !important
    }

    .pb-md-6 {
        padding-bottom: 3rem !important
    }

    .ps-md-6 {
        padding-left: 3rem !important
    }

    .mt-md-6 {
        margin-top: 3rem !important
    }

    .me-md-6 {
        margin-right: 3rem !important
    }

    .mb-md-6 {
        margin-bottom: 3rem !important
    }

    .ms-md-6 {
        margin-left: 3rem !important
    }

    .pt-md-auto {
        padding-top: auto !important
    }

    .pe-md-auto {
        padding-right: auto !important
    }

    .pb-md-auto {
        padding-bottom: auto !important
    }

    .ps-md-auto {
        padding-left: auto !important
    }

    .mt-md-auto {
        margin-top: auto !important
    }

    .me-md-auto {
        margin-right: auto !important
    }

    .mb-md-auto {
        margin-bottom: auto !important
    }

    .ms-md-auto {
        margin-left: auto !important
    }
}

@media (min-width: 1200px) {
    .p-lg-0 {
        padding: 0 !important
    }

    .px-lg-0 {
        padding-right: 0 !important;
        padding-left: 0 !important
    }

    .py-lg-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .m-lg-0 {
        margin: 0 !important
    }

    .mx-lg-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-lg-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .p-lg-1 {
        padding: .3334rem !important
    }

    .px-lg-1 {
        padding-right: .3334rem !important;
        padding-left: .3334rem !important
    }

    .py-lg-1 {
        padding-top: .3334rem !important;
        padding-bottom: .3334rem !important
    }

    .m-lg-1 {
        margin: .3334rem !important
    }

    .mx-lg-1 {
        margin-right: .3334rem !important;
        margin-left: .3334rem !important
    }

    .my-lg-1 {
        margin-top: .3334rem !important;
        margin-bottom: .3334rem !important
    }

    .p-lg-2 {
        padding: .6667rem !important
    }

    .px-lg-2 {
        padding-right: .6667rem !important;
        padding-left: .6667rem !important
    }

    .py-lg-2 {
        padding-top: .6667rem !important;
        padding-bottom: .6667rem !important
    }

    .m-lg-2 {
        margin: .6667rem !important
    }

    .mx-lg-2 {
        margin-right: .6667rem !important;
        margin-left: .6667rem !important
    }

    .my-lg-2 {
        margin-top: .6667rem !important;
        margin-bottom: .6667rem !important
    }

    .p-lg-3 {
        padding: 1rem !important
    }

    .px-lg-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-lg-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .m-lg-3 {
        margin: 1rem !important
    }

    .mx-lg-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-lg-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .p-lg-4 {
        padding: 1.3334rem !important
    }

    .px-lg-4 {
        padding-right: 1.3334rem !important;
        padding-left: 1.3334rem !important
    }

    .py-lg-4 {
        padding-top: 1.3334rem !important;
        padding-bottom: 1.3334rem !important
    }

    .m-lg-4 {
        margin: 1.3334rem !important
    }

    .mx-lg-4 {
        margin-right: 1.3334rem !important;
        margin-left: 1.3334rem !important
    }

    .my-lg-4 {
        margin-top: 1.3334rem !important;
        margin-bottom: 1.3334rem !important
    }

    .p-lg-5 {
        padding: 2rem !important
    }

    .px-lg-5 {
        padding-right: 2rem !important;
        padding-left: 2rem !important
    }

    .py-lg-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important
    }

    .m-lg-5 {
        margin: 2rem !important
    }

    .mx-lg-5 {
        margin-right: 2rem !important;
        margin-left: 2rem !important
    }

    .my-lg-5 {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important
    }

    .p-lg-6 {
        padding: 3rem !important
    }

    .px-lg-6 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-lg-6 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-lg-6 {
        margin: 3rem !important
    }

    .mx-lg-6 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-lg-6 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-lg-auto {
        padding: auto !important
    }

    .px-lg-auto {
        padding-right: auto !important;
        padding-left: auto !important
    }

    .py-lg-auto {
        padding-top: auto !important;
        padding-bottom: auto !important
    }

    .m-lg-auto {
        margin: auto !important
    }

    .mx-lg-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-lg-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }

    .pt-lg-0 {
        padding-top: 0 !important
    }

    .pe-lg-0 {
        padding-right: 0 !important
    }

    .pb-lg-0 {
        padding-bottom: 0 !important
    }

    .ps-lg-0 {
        padding-left: 0 !important
    }

    .mt-lg-0 {
        margin-top: 0 !important
    }

    .me-lg-0 {
        margin-right: 0 !important
    }

    .mb-lg-0 {
        margin-bottom: 0 !important
    }

    .ms-lg-0 {
        margin-left: 0 !important
    }

    .pt-lg-1 {
        padding-top: .3334rem !important
    }

    .pe-lg-1 {
        padding-right: .3334rem !important
    }

    .pb-lg-1 {
        padding-bottom: .3334rem !important
    }

    .ps-lg-1 {
        padding-left: .3334rem !important
    }

    .mt-lg-1 {
        margin-top: .3334rem !important
    }

    .me-lg-1 {
        margin-right: .3334rem !important
    }

    .mb-lg-1 {
        margin-bottom: .3334rem !important
    }

    .ms-lg-1 {
        margin-left: .3334rem !important
    }

    .pt-lg-2 {
        padding-top: .6667rem !important
    }

    .pe-lg-2 {
        padding-right: .6667rem !important
    }

    .pb-lg-2 {
        padding-bottom: .6667rem !important
    }

    .ps-lg-2 {
        padding-left: .6667rem !important
    }

    .mt-lg-2 {
        margin-top: .6667rem !important
    }

    .me-lg-2 {
        margin-right: .6667rem !important
    }

    .mb-lg-2 {
        margin-bottom: .6667rem !important
    }

    .ms-lg-2 {
        margin-left: .6667rem !important
    }

    .pt-lg-3 {
        padding-top: 1rem !important
    }

    .pe-lg-3 {
        padding-right: 1rem !important
    }

    .pb-lg-3 {
        padding-bottom: 1rem !important
    }

    .ps-lg-3 {
        padding-left: 1rem !important
    }

    .mt-lg-3 {
        margin-top: 1rem !important
    }

    .me-lg-3 {
        margin-right: 1rem !important
    }

    .mb-lg-3 {
        margin-bottom: 1rem !important
    }

    .ms-lg-3 {
        margin-left: 1rem !important
    }

    .pt-lg-4 {
        padding-top: 1.3334rem !important
    }

    .pe-lg-4 {
        padding-right: 1.3334rem !important
    }

    .pb-lg-4 {
        padding-bottom: 1.3334rem !important
    }

    .ps-lg-4 {
        padding-left: 1.3334rem !important
    }

    .mt-lg-4 {
        margin-top: 1.3334rem !important
    }

    .me-lg-4 {
        margin-right: 1.3334rem !important
    }

    .mb-lg-4 {
        margin-bottom: 1.3334rem !important
    }

    .ms-lg-4 {
        margin-left: 1.3334rem !important
    }

    .pt-lg-5 {
        padding-top: 2rem !important
    }

    .pe-lg-5 {
        padding-right: 2rem !important
    }

    .pb-lg-5 {
        padding-bottom: 2rem !important
    }

    .ps-lg-5 {
        padding-left: 2rem !important
    }

    .mt-lg-5 {
        margin-top: 2rem !important
    }

    .me-lg-5 {
        margin-right: 2rem !important
    }

    .mb-lg-5 {
        margin-bottom: 2rem !important
    }

    .ms-lg-5 {
        margin-left: 2rem !important
    }

    .pt-lg-6 {
        padding-top: 3rem !important
    }

    .pe-lg-6 {
        padding-right: 3rem !important
    }

    .pb-lg-6 {
        padding-bottom: 3rem !important
    }

    .ps-lg-6 {
        padding-left: 3rem !important
    }

    .mt-lg-6 {
        margin-top: 3rem !important
    }

    .me-lg-6 {
        margin-right: 3rem !important
    }

    .mb-lg-6 {
        margin-bottom: 3rem !important
    }

    .ms-lg-6 {
        margin-left: 3rem !important
    }

    .pt-lg-auto {
        padding-top: auto !important
    }

    .pe-lg-auto {
        padding-right: auto !important
    }

    .pb-lg-auto {
        padding-bottom: auto !important
    }

    .ps-lg-auto {
        padding-left: auto !important
    }

    .mt-lg-auto {
        margin-top: auto !important
    }

    .me-lg-auto {
        margin-right: auto !important
    }

    .mb-lg-auto {
        margin-bottom: auto !important
    }

    .ms-lg-auto {
        margin-left: auto !important
    }
}

.clearfix:after {
    display: block;
    clear: both;
    content: ""
}

.ratio {
    position: relative;
    width: 100%
}

.ratio:before {
    display: block;
    padding-top: var(--aspect-ratio);
    content: ""
}

.ratio>* {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ratio-placeholder {
    position: absolute;
    inset: 0;
    filter: blur(20px);
    z-index: -1
}

.ratio-1x1 {
    --aspect-ratio: 100%
}

.ratio-4x3 {
    --aspect-ratio: 75%
}

.ratio-16x9 {
    --aspect-ratio: 56.25%
}

.ratio-21x9 {
    --aspect-ratio: 42.8571428571%
}

.visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important
}

.align-middle {
    vertical-align: middle !important
}

.position-static {
    position: static !important
}

.position-relative {
    position: relative !important
}

.position-absolute {
    position: absolute !important
}

.position-fixed {
    position: fixed !important
}

.position-sticky {
    position: sticky !important
}

.translate-middle {
    transform: translate(-50%, -50%) !important
}

.translate-middle-x {
    transform: translate(-50%) !important
}

.translate-middle-y {
    transform: translateY(-50%) !important
}

.visible {
    visibility: visible !important
}

.invisible {
    visibility: hidden !important
}

.border-radius {
    border-radius: var(--de-borderRadius)
}

.border-radius-sm {
    border-radius: var(--de-borderRadiusSm)
}

.border-radius-lg {
    border-radius: var(--de-borderRadiusLg)
}

.border-radius-xl {
    border-radius: var(--de-borderRadiusXl)
}

.radius-circle {
    border-radius: 100%
}

.border-radius-start {
    border-top-left-radius: var(--de-borderRadius) !important;
    border-bottom-left-radius: var(--de-borderRadius) !important
}

.border-radius-end {
    border-top-right-radius: var(--de-borderRadius) !important;
    border-bottom-right-radius: var(--de-borderRadius) !important
}

.border-radius-end-0 {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important
}

.border-radius-start-0 {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important
}

.logo-filled {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--de-btnSecondaryBg);
    border-radius: 100%;
    text-align: center
}

.logo-filled img {
    display: block;
    object-fit: contain;
    width: 100%;
    height: 100%
}

.logo-filled img[src*=heco] {
    padding: 4px
}

.logo-filled.chain-logo-42161 {
    background: none
}

.logo-lg {
    width: 40px;
    height: 40px;
    object-fit: contain
}

.logo-md {
    width: 24px;
    height: 24px;
    object-fit: contain
}

.logo-sm {
    width: 20px;
    height: 20px;
    object-fit: contain
}

.logo-xs {
    width: 16px;
    height: 16px;
    object-fit: contain
}

.cursor-pointer {
    cursor: pointer !important
}

.cursor-default {
    cursor: default !important
}

.bottom-separator {
    border-bottom: 1px solid var(--de-borderColor)
}

.top-separator {
    border-top: 1px solid var(--de-borderColor)
}

.accent-bg {
    background: var(--de-accentBg)
}

.blue-bg-grad {
    background: linear-gradient(104.11deg, #0597D6 9.79%, #8400C2 105.58%)
}

.green-bg-grad {
    background: linear-gradient(104.11deg, #9305D6 9.79%, #00C236 105.58%)
}

.nowrap-span>span {
    white-space: nowrap
}

.overflow-hidden {
    overflow: hidden
}

:root {
    --de-borderRadiusSm: calc(var(--de-borderRadius) / 2);
    --de-borderRadiusLg: calc(var(--de-borderRadius) * 2);
    --de-borderRadiusXl: calc(var(--de-borderRadius) * 3);
    --deswap-color: #ABDA02;
    --dln-color: #755CB4;
    --bannerTextColorDark: #E6EDE4;
    --bannerColorDark: linear-gradient(334deg, rgba(251, 255, 58, .4) -314.11%, rgba(251, 255, 58, .02) 71.34%);
    --bannerTextColorLight: #0F0A1E;
    --bannerColorLight: rgba(255, 255, 255, .4);
    --copy-text: "copied"
}

* {
    box-sizing: border-box
}

svg, img {
    max-width: 100%;
    height: auto
}

html, body {
    margin: 0;
    padding: 0
}

@media (min-width: 768px) {
    html, body {
        overscroll-behavior-y: none
    }
}

iframe {
    border: none;
    background: none;
    padding: 0;
    margin: 0
}

button:focus, button:focus-visible, a:focus, a:focus-visible {
    outline: none
}

.reset-list {
    list-style: none;
    padding: 0;
    margin: 0
}

.reset-button {
    background: none;
    padding: 0;
    margin: 0;
    border: none;
    color: inherit;
    font: inherit
}

.reset-input {
    background: none;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    font: inherit;
    color: inherit
}

.reset-input:focus {
    outline: none;
    box-shadow: none
}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

input:focus, input:focus-visible {
    outline: none;
    box-shadow: none
}

:host {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0
}

.container-fluid, .container {
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto
}

.container-fluid-lg {
    padding: 0
}

@media (min-width: 992px) {
    .container-fluid-lg {
        padding: 0 calc(var(--bs-gutter-x) / 2)
    }
}

@media (min-width: 3840px) {
    .container-fluid-lg {
        max-width: 2560px;
        margin: 0 auto
    }
}

.container {
    width: calc(var(--container-width) + var(--bs-gutter-x))
}

@media (min-width: 3840px) {
    .container-fluid {
        max-width: 2560px
    }
}

.w-100 {
    width: 100%
}

.w-auto {
    width: auto
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x))
}

.row>* {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5)
}

.gx-1 {
    --bs-gutter-x: .6666rem
}

.gx-2 {
    --bs-gutter-x: var(--de-gapMd)
}

.gx-3 {
    --bs-gutter-x: 2rem
}

.gx-4 {
    --bs-gutter-x: 2.6667rem
}

.col {
    flex: 1 0 0
}

.col-auto {
    flex: 0 0 auto;
    width: auto
}

.col-1 {
    flex: 0 0 auto;
    width: 8.3333333333%
}

.col-2 {
    flex: 0 0 auto;
    width: 16.6666666667%
}

.col-3 {
    flex: 0 0 auto;
    width: 25%
}

.col-4 {
    flex: 0 0 auto;
    width: 33.3333333333%
}

.col-5 {
    flex: 0 0 auto;
    width: 41.6666666667%
}

.col-6 {
    flex: 0 0 auto;
    width: 50%
}

.col-7 {
    flex: 0 0 auto;
    width: 58.3333333333%
}

.col-8 {
    flex: 0 0 auto;
    width: 66.6666666667%
}

.col-9 {
    flex: 0 0 auto;
    width: 75%
}

.col-10 {
    flex: 0 0 auto;
    width: 83.3333333333%
}

.col-11 {
    flex: 0 0 auto;
    width: 91.6666666667%
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

@media (min-width: 576px) {
    .col-sm {
        flex: 1 0 0
    }

    .col-sm-auto {
        flex: 0 0 auto;
        width: auto
    }

    .col-sm-1 {
        flex: 0 0 auto;
        width: 8.3333333333%
    }

    .col-sm-2 {
        flex: 0 0 auto;
        width: 16.6666666667%
    }

    .col-sm-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-sm-4 {
        flex: 0 0 auto;
        width: 33.3333333333%
    }

    .col-sm-5 {
        flex: 0 0 auto;
        width: 41.6666666667%
    }

    .col-sm-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-sm-7 {
        flex: 0 0 auto;
        width: 58.3333333333%
    }

    .col-sm-8 {
        flex: 0 0 auto;
        width: 66.6666666667%
    }

    .col-sm-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-sm-10 {
        flex: 0 0 auto;
        width: 83.3333333333%
    }

    .col-sm-11 {
        flex: 0 0 auto;
        width: 91.6666666667%
    }

    .col-sm-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 768px) {
    .col-md {
        flex: 1 0 0
    }

    .col-md-auto {
        flex: 0 0 auto;
        width: auto
    }

    .col-md-1 {
        flex: 0 0 auto;
        width: 8.3333333333%
    }

    .col-md-2 {
        flex: 0 0 auto;
        width: 16.6666666667%
    }

    .col-md-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-md-4 {
        flex: 0 0 auto;
        width: 33.3333333333%
    }

    .col-md-5 {
        flex: 0 0 auto;
        width: 41.6666666667%
    }

    .col-md-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-md-7 {
        flex: 0 0 auto;
        width: 58.3333333333%
    }

    .col-md-8 {
        flex: 0 0 auto;
        width: 66.6666666667%
    }

    .col-md-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-md-10 {
        flex: 0 0 auto;
        width: 83.3333333333%
    }

    .col-md-11 {
        flex: 0 0 auto;
        width: 91.6666666667%
    }

    .col-md-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 992px) {
    .col-lg {
        flex: 1 0 0
    }

    .col-lg-auto {
        flex: 0 0 auto;
        width: auto
    }

    .col-lg-1 {
        flex: 0 0 auto;
        width: 8.3333333333%
    }

    .col-lg-2 {
        flex: 0 0 auto;
        width: 16.6666666667%
    }

    .col-lg-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-lg-4 {
        flex: 0 0 auto;
        width: 33.3333333333%
    }

    .col-lg-5 {
        flex: 0 0 auto;
        width: 41.6666666667%
    }

    .col-lg-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-lg-7 {
        flex: 0 0 auto;
        width: 58.3333333333%
    }

    .col-lg-8 {
        flex: 0 0 auto;
        width: 66.6666666667%
    }

    .col-lg-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-lg-10 {
        flex: 0 0 auto;
        width: 83.3333333333%
    }

    .col-lg-11 {
        flex: 0 0 auto;
        width: 91.6666666667%
    }

    .col-lg-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 1200px) {
    .col-xl {
        flex: 1 0 0
    }

    .col-xl-auto {
        flex: 0 0 auto;
        width: auto
    }

    .col-xl-1 {
        flex: 0 0 auto;
        width: 8.3333333333%
    }

    .col-xl-2 {
        flex: 0 0 auto;
        width: 16.6666666667%
    }

    .col-xl-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-xl-4 {
        flex: 0 0 auto;
        width: 33.3333333333%
    }

    .col-xl-5 {
        flex: 0 0 auto;
        width: 41.6666666667%
    }

    .col-xl-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-xl-7 {
        flex: 0 0 auto;
        width: 58.3333333333%
    }

    .col-xl-8 {
        flex: 0 0 auto;
        width: 66.6666666667%
    }

    .col-xl-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-xl-10 {
        flex: 0 0 auto;
        width: 83.3333333333%
    }

    .col-xl-11 {
        flex: 0 0 auto;
        width: 91.6666666667%
    }

    .col-xl-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 1400px) {
    .col-xxl {
        flex: 1 0 0
    }

    .col-xxl-auto {
        flex: 0 0 auto;
        width: auto
    }

    .col-xxl-1 {
        flex: 0 0 auto;
        width: 8.3333333333%
    }

    .col-xxl-2 {
        flex: 0 0 auto;
        width: 16.6666666667%
    }

    .col-xxl-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-xxl-4 {
        flex: 0 0 auto;
        width: 33.3333333333%
    }

    .col-xxl-5 {
        flex: 0 0 auto;
        width: 41.6666666667%
    }

    .col-xxl-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-xxl-7 {
        flex: 0 0 auto;
        width: 58.3333333333%
    }

    .col-xxl-8 {
        flex: 0 0 auto;
        width: 66.6666666667%
    }

    .col-xxl-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-xxl-10 {
        flex: 0 0 auto;
        width: 83.3333333333%
    }

    .col-xxl-11 {
        flex: 0 0 auto;
        width: 91.6666666667%
    }

    .col-xxl-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

.d-inline {
    display: inline !important
}

.d-inline-block {
    display: inline-block !important
}

.d-block {
    display: block !important
}

.d-flex {
    display: flex !important
}

.d-inline-flex {
    display: inline-flex !important
}

.d-none {
    display: none !important
}

.flex-fill {
    flex: 1 1 auto !important
}

.flex-row {
    flex-direction: row !important
}

.flex-column {
    flex-direction: column !important
}

.flex-row-reverse {
    flex-direction: row-reverse !important
}

.flex-column-reverse {
    flex-direction: column-reverse !important
}

.flex-wrap {
    flex-wrap: wrap !important
}

.flex-nowrap {
    flex-wrap: nowrap !important
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse !important
}

.justify-content-start {
    justify-content: flex-start !important
}

.justify-content-end {
    justify-content: flex-end !important
}

.justify-content-center {
    justify-content: center !important
}

.justify-content-between {
    justify-content: space-between !important
}

.justify-content-around {
    justify-content: space-around !important
}

.justify-content-evenly {
    justify-content: space-evenly !important
}

.align-items-start {
    align-items: flex-start !important
}

.align-items-end {
    align-items: flex-end !important
}

.align-items-center {
    align-items: center !important
}

.align-items-baseline {
    align-items: baseline !important
}

.align-items-stretch {
    align-items: stretch !important
}

.align-content-start {
    align-content: flex-start !important
}

.align-content-end {
    align-content: flex-end !important
}

.align-content-center {
    align-content: center !important
}

.align-content-between {
    align-content: space-between !important
}

.align-content-around {
    align-content: space-around !important
}

.align-content-stretch {
    align-content: stretch !important
}

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

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

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

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

.align-self-baseline {
    align-self: baseline !important
}

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

.order-first {
    order: -1 !important
}

.order-0 {
    order: 0 !important
}

.order-1 {
    order: 1 !important
}

.order-2 {
    order: 2 !important
}

.order-3 {
    order: 3 !important
}

.order-4 {
    order: 4 !important
}

.order-5 {
    order: 5 !important
}

.order-last {
    order: 6 !important
}

.text-end, .text-right {
    text-align: right !important
}

.text-center {
    text-align: center !important
}

.text-start, .text-left {
    text-align: left !important
}

@media (min-width: 768px) {
    .order-md-2 {
        order: 2 !important
    }

    .order-md-1 {
        order: 1 !important
    }

    .d-md-inline {
        display: inline !important
    }

    .d-md-inline-block {
        display: inline-block !important
    }

    .d-md-block {
        display: block !important
    }

    .d-md-grid {
        display: grid !important
    }

    .d-md-table {
        display: table !important
    }

    .d-md-table-row {
        display: table-row !important
    }

    .d-md-table-cell {
        display: table-cell !important
    }

    .d-md-flex {
        display: flex !important
    }

    .d-md-inline-flex {
        display: inline-flex !important
    }

    .d-md-none {
        display: none !important
    }

    .flex-md-fill {
        flex: 1 1 auto !important
    }

    .flex-md-row {
        flex-direction: row !important
    }

    .flex-md-column {
        flex-direction: column !important
    }

    .flex-md-row-reverse {
        flex-direction: row-reverse !important
    }

    .flex-md-column-reverse {
        flex-direction: column-reverse !important
    }

    .flex-md-grow-0 {
        flex-grow: 0 !important
    }

    .flex-md-grow-1 {
        flex-grow: 1 !important
    }

    .flex-md-shrink-0 {
        flex-shrink: 0 !important
    }

    .flex-md-shrink-1 {
        flex-shrink: 1 !important
    }

    .flex-md-wrap {
        flex-wrap: wrap !important
    }

    .flex-md-nowrap {
        flex-wrap: nowrap !important
    }

    .flex-md-wrap-reverse {
        flex-wrap: wrap-reverse !important
    }

    .justify-content-md-start {
        justify-content: flex-start !important
    }

    .justify-content-md-end {
        justify-content: flex-end !important
    }

    .justify-content-md-center {
        justify-content: center !important
    }

    .justify-content-md-between {
        justify-content: space-between !important
    }

    .justify-content-md-around {
        justify-content: space-around !important
    }

    .justify-content-md-evenly {
        justify-content: space-evenly !important
    }

    .align-items-md-start {
        align-items: flex-start !important
    }

    .align-items-md-end {
        align-items: flex-end !important
    }

    .align-items-md-center {
        align-items: center !important
    }

    .align-items-md-baseline {
        align-items: baseline !important
    }

    .align-items-md-stretch {
        align-items: stretch !important
    }

    .align-content-md-start {
        align-content: flex-start !important
    }

    .align-content-md-end {
        align-content: flex-end !important
    }

    .align-content-md-center {
        align-content: center !important
    }

    .align-content-md-between {
        align-content: space-between !important
    }

    .align-content-md-around {
        align-content: space-around !important
    }

    .align-content-md-stretch {
        align-content: stretch !important
    }

    .align-self-md-auto {
        align-self: auto !important
    }

    .align-self-md-start {
        align-self: flex-start !important
    }

    .align-self-md-end {
        align-self: flex-end !important
    }

    .align-self-md-center {
        align-self: center !important
    }

    .align-self-md-baseline {
        align-self: baseline !important
    }

    .align-self-md-stretch {
        align-self: stretch !important
    }

    .text-md-center {
        text-align: center !important
    }

    .text-md-end {
        text-align: right !important
    }

    .ms-md-auto {
        margin-left: auto
    }

    .mb-md-0 {
        margin-bottom: 0 !important
    }
}

@media (min-width: 992px) {
    .ms-lg-auto {
        margin-left: auto
    }

    .text-lg-end {
        text-align: right !important
    }

    .order-lg-3 {
        order: 3 !important
    }

    .order-lg-2 {
        order: 2 !important
    }

    .order-lg-1 {
        order: 1 !important
    }

    .d-lg-inline {
        display: inline !important
    }

    .d-lg-inline-block {
        display: inline-block !important
    }

    .d-lg-block {
        display: block !important
    }

    .d-lg-grid {
        display: grid !important
    }

    .d-lg-table {
        display: table !important
    }

    .d-lg-table-row {
        display: table-row !important
    }

    .d-lg-table-cell {
        display: table-cell !important
    }

    .d-lg-flex {
        display: flex !important
    }

    .d-lg-inline-flex {
        display: inline-flex !important
    }

    .d-lg-none {
        display: none !important
    }

    .justify-content-lg-start {
        justify-content: flex-start !important
    }

    .justify-content-lg-end {
        justify-content: flex-end !important
    }

    .justify-content-lg-center {
        justify-content: center !important
    }

    .justify-content-lg-between {
        justify-content: space-between !important
    }

    .justify-content-lg-around {
        justify-content: space-around !important
    }

    .justify-content-lg-evenly {
        justify-content: space-evenly !important
    }

    .align-items-lg-start {
        align-items: flex-start !important
    }

    .align-items-lg-end {
        align-items: flex-end !important
    }

    .align-items-lg-center {
        align-items: center !important
    }

    .align-items-lg-baseline {
        align-items: baseline !important
    }

    .align-items-lg-stretch {
        align-items: stretch !important
    }

    .align-content-lg-start {
        align-content: flex-start !important
    }

    .align-content-lg-end {
        align-content: flex-end !important
    }

    .align-content-lg-center {
        align-content: center !important
    }

    .align-content-lg-between {
        align-content: space-between !important
    }

    .align-content-lg-around {
        align-content: space-around !important
    }

    .align-content-lg-stretch {
        align-content: stretch !important
    }

    .align-self-lg-auto {
        align-self: auto !important
    }

    .align-self-lg-start {
        align-self: flex-start !important
    }

    .align-self-lg-end {
        align-self: flex-end !important
    }

    .align-self-lg-center {
        align-self: center !important
    }

    .align-self-lg-baseline {
        align-self: baseline !important
    }

    .align-self-lg-stretch {
        align-self: stretch !important
    }

    .flex-lg-wrap {
        flex-wrap: wrap !important
    }

    .flex-lg-nowrap {
        flex-wrap: nowrap !important
    }

    .flex-lg-wrap-reverse {
        flex-wrap: wrap-reverse !important
    }
}

.hstack {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-self: stretch
}

.vstack {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-self: stretch
}

.flex-1 {
    flex: 1
}

.padding-md {
    padding: var(--de-gapMd)
}

.padding-sm {
    padding: var(--de-gapSm)
}

.padding-lg {
    padding: var(--de-gapLg)
}

@keyframes rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes headShake {
    0% {
        transform: translate(0)
    }

    6.5% {
        transform: translate(-6px) rotateY(-9deg)
    }

    18.5% {
        transform: translate(5px) rotateY(7deg)
    }

    31.5% {
        transform: translate(-3px) rotateY(-5deg)
    }

    43.5% {
        transform: translate(2px) rotateY(3deg)
    }

    50% {
        transform: translate(0)
    }
}

.headShake {
    animation-timing-function: ease-in-out;
    animation-name: headShake
}

.animated {
    animation-duration: 1s;
    animation-fill-mode: both
}

.animated.infinite {
    animation-iteration-count: infinite
}

.animated.delay-1s {
    animation-delay: 1s
}

.animated.delay-2s {
    animation-delay: 2s
}

.animated.delay-3s {
    animation-delay: 3s
}

.animated.delay-4s {
    animation-delay: 4s
}

.animated.delay-5s {
    animation-delay: 5s
}

.animated.fast {
    animation-duration: .8s
}

.animated.faster {
    animation-duration: .5s
}

.animated.slow {
    animation-duration: 2s
}

.animated.slower {
    animation-duration: 3s
}

@media (print), (prefers-reduced-motion: reduce) {
    .animated {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
        animation-iteration-count: 1 !important
    }
}

@keyframes loading-rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

body {
    font-size: var(--de-bodyFontSize);
    line-height: var(--de-bodyLineHeight);
    font-family: var(--de-fontFamily);
    color: var(--de-bodyColor)
}

.text-muted {
    color: var(--de-mutedColor) !important
}

.text-primary {
    color: #13f2ff !important
}

.text-success {
    color: var(--de-success) !important
}

.text-warning {
    color: var(--de-warning) !important
}

.text-error {
    color: var(--de-error) !important
}

.icon-color {
    color: var(--de-iconColor)
}

.text-inherit {
    color: inherit !important
}

.primary-on-hover:hover {
    color: var(--de-primary)
}

.text-transform-none {
    text-transform: none !important
}

.text-uppercase {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.text-line-through {
    text-decoration: line-through
}

.text-lowercase {
    text-transform: lowercase
}

.text-decoration-none {
    text-decoration: none !important
}

.fw-300 {
    font-weight: 300
}

.fw-400, .fw-500 {
    font-weight: 500
}

.fw-600 {
    font-weight: 600
}

.fw-700 {
    font-weight: 700
}

.font-style-inherit {
    font-style: inherit !important
}

.text-overflow {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis
}

.no-wrap {
    white-space: nowrap
}

.break-word {
    word-break: break-all;
    word-wrap: break-word
}

.valign-middle {
    vertical-align: middle !important
}

.lottie-loader {
    height: 70px
}

.preloader-above {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 800;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden
}

.preloader-above:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--de-bodyBg);
    opacity: .6;
    top: 0;
    left: 0;
    z-index: -1;
    border-radius: inherit
}

.preloader-above .lottie-loader {
    width: 100%;
    height: 100%;
    max-height: 100px;
    max-width: 100px
}

.preloader-above__logo-animated {
    max-width: 80px;
    max-height: 80px
}

.blur-loader {
    position: relative
}

.blur-loader>* {
    filter: blur(3px)
}

.filter-blur {
    filter: blur(3px)
}

.opacity-loading {
    opacity: .6
}

.skeleton-loader {
    display: inline-block;
    background: rgba(255, 255, 255, .05);
    background: linear-gradient(110deg, rgba(255, 255, 255, .05) 10%, rgba(255, 255, 255, .1) 30%, rgba(255, 255, 255, .05) 50%);
    border-radius: var(--de-borderRadiusSm);
    background-size: 200% 100%;
    animation: 1.5s shine linear infinite;
    color: transparent
}

@keyframes shine {
    to {
        background-position-x: -200%
    }
}

.input-loader {
    background-image: linear-gradient(110deg, var(--de-controlBgHover) 10%, var(--de-controlBg) 30%, var(--de-controlBgHover) 50%);
    background-size: 200% 100%;
    animation: 1.5s shine linear infinite
}

.input-loader>* {
    filter: blur(3px);
    opacity: .9;
    cursor: default;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none
}

body {
    --mdc-linear-progress-active-indicator-color: var(--de-primary)
}

.mat-progress-spinner circle, .mat-spinner circle {
    stroke: #fa7080
}

.mat-progress-spinner.mat-accent circle, .mat-spinner.mat-accent circle {
    stroke: var(--de-primary)
}

.mdc-linear-progress .mdc-linear-progress__buffer-bar {
    background-color: var(--de-controlBg)
}

.progress-bar {
    background: var(--de-controlBg);
    border: 1px solid var(--de-controlBorder);
    position: relative;
    overflow: hidden;
    height: 12px;
    border-radius: 4px
}

.progress-bar__line {
    background: var(--de-primary);
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    transition: width 1s linear;
    border-radius: 0 4px 4px 0
}

.progress-bar.progress-bar-chart {
    background: var(--proggress-bg-chart)
}

.progress-bar.progress-bar-chart .progress-bar__line {
    background: var(--proggress-line-chart)
}

.progress-bar-secondary .progress-bar__line {
    background: var(--de-btnSecondaryBg)
}

.progress-bar-animation .progress-bar__line {
    animation: progress-bar 10s linear
}

@keyframes progress-bar {
    0% {
        width: 0
    }

    to {
        width: 100%
    }
}

.btn-progress-bar {
    position: relative
}

.btn-progress-bar .progress-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px
}

.btn-progress-bar .progress-bar-xs {
    height: 2px
}

.btn-progress-bar .progress-bar-xs .progress-bar__line {
    border-radius: 0 2px 2px 0
}

.wave-loader {
    overflow: hidden
}

.wave-loader__change {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    transition: top 1s linear
}

.wave-loader__change:before, .wave-loader__change:after {
    content: "";
    position: absolute;
    width: 200%;
    height: 200%;
    top: 50%;
    left: 50%;
    background-color: var(--de-bodyBg);
    border-radius: 45% 47% 43% 46%;
    transform: translate(-50%, -70%) rotate(0);
    animation: wave-rotate 7s linear infinite;
    z-index: 1
}

.wave-loader__change:after {
    border-radius: 47% 42% 46% 44%;
    opacity: .8;
    transform: translate(-50%, -70%) rotate(0);
    animation: wave-rotate 9s linear -4s infinite;
    z-index: 2;
    background-color: var(--de-bodyBg)
}

.wave-loader__wave {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: var(--de-btnSecondaryOutlineHover)
}

@keyframes wave-rotate {
    50% {
        transform: translate(-50%, -73%) rotate(180deg)
    }

    to {
        transform: translate(-50%, -70%) rotate(360deg)
    }
}

body {
    --mdc-chip-elevated-container-color: var(--de-btnSecondaryBg);
    --mdc-chip-label-text-color: var(--de-btnSecondaryTextColor);
    --mdc-chip-container-shape-radius: var(--de-borderRadiusSm);
    --mdc-chip-container-height: auto;
    --mdc-chip-with-trailing-icon-trailing-icon-color: var(--de-mutedColor)
}

.chip-select-group.show-all-btn .mat-mdc-chip-grid {
    padding-right: 8.2rem
}

.chip-select-group .mdc-evolution-chip-set {
    align-items: center
}

.chip-select-group .mdc-evolution-chip-set .mdc-evolution-chip-set__chips {
    margin: 0
}

.chip-select-group .mdc-evolution-chip-set input.mat-mdc-chip-input {
    padding: 0 0 4px
}

.chip-select-group .mdc-evolution-chip-set .mdc-evolution-chip {
    margin-left: 0;
    margin-right: 4px;
    margin-top: 0
}

.mat-mdc-chip {
    padding: 4px 8px;
    font-size: 12px;
    line-height: 1.3334;
    font-weight: 400;
    border: none;
    border-radius: var(--de-borderRadiusSm);
    font-family: var(--de-fontFamilyMonospace);
    min-height: var(--de-btnSizeSm)
}

.mat-mdc-chip+.mat-mdc-chip {
    margin-left: .5rem
}

.mat-mdc-chip-action-label {
    display: flex;
    align-items: center
}

.mat-mdc-chip .mat-mdc-chip-action {
    padding-left: 0 !important
}

.mat-mdc-chip:hover {
    --mdc-chip-elevated-container-color: var(--de-btnSecondaryBgHover);
    --mdc-chip-label-text-color: var(--de-btnSecondaryTextColorHover)
}

.mat-mdc-chip img {
    width: 14px;
    height: 14px
}

.mat-mdc-chip.mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing {
    height: 14px;
    width: 14px;
    font-size: 10px
}

.mat-mdc-chip .mat-mdc-chip-remove {
    background: none;
    padding: 0;
    border: none;
    opacity: 1 !important;
    width: auto;
    height: auto;
    margin: 0 0 0 4px;
    line-height: 1;
    padding-right: 0 !important;
    font-size: 10px
}

.mat-mdc-chip .mat-mdc-chip-remove:after {
    display: block;
    content: "\e90c";
    font-family: icomoon
}

.mat-mdc-chip .mat-mdc-chip-remove:hover {
    opacity: 1;
    --mdc-chip-with-trailing-icon-trailing-icon-color: var(--de-error)
}

.all-selected-label {
    margin-left: .2rem;
    margin-bottom: 4px
}

button {
    cursor: pointer
}

.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--de-btnPadding-top) var(--de-btnPadding-right) var(--de-btnPadding-bottom) var(--de-btnPadding-left);
    font-family: var(--de-fontFamily);
    font-size: var(--de-btnFontSize);
    line-height: var(--de-bodyLineHeight);
    font-weight: var(--de-btnFontWeight);
    text-align: center;
    border-radius: var(--de-borderRadiusSm);
    border: var(--de-borderWidth) solid transparent;
    text-decoration: none;
    transition: all .3s;
    cursor: pointer
}

.btn:focus {
    outline: none
}

.btn .tag {
    line-height: 1;
    min-height: initial
}

.btn-sm {
    font-size: 12px;
    line-height: 1.3334;
    padding: 3px 8px;
    min-height: var(--de-btnSizeSm);
    font-family: var(--de-fontFamilyMonospace)
}

.btn-lg {
    font-size: var(--theme-H2FontSize);
    padding: 1rem 2rem;
    min-height: var(--de-btnSizeLg)
}

.btn-block {
    width: 100%
}

.btn-primary {
    --de-btnLoaderBg: var(--de-btnPrimaryTextColor);
    background: #1c92e5;
    color: var(--de-btnPrimaryTextColor)
}

.btn-primary:hover, .btn-primary:focus {
    background: #1c56e5;
    color: var(--de-btnPrimaryTextColorHover)
}

.btn-primary.disabled, .btn-primary:disabled {
    background: var(--de-btnPrimaryBgDisabled);
    color: var(--de-btnPrimaryTextColorDisabled)
}

.btn-secondary {
    --de-btnLoaderBg: var(--de-btnSecondaryTextColor);
    background: var(--de-btnSecondaryBg);
    color: var(--de-btnSecondaryTextColor);
    border-color: var(--de-btnSecondaryBorder, transparent)
}

.btn-secondary:not(:disabled):hover {
    background: var(--de-btnSecondaryBgHover);
    color: var(--de-btnSecondaryTextColorHover)
}

.btn-secondary:not(.disabled-opacity).disabled, .btn-secondary:not(.disabled-opacity):disabled {
    background: var(--de-btnSecondaryBgDisabled);
    color: var(--de-btnSecondaryTextColorDisabled)
}

.btn-outline-secondary {
    --de-btnLoaderBg: var(--de-bodyColor);
    color: var(--de-bodyColor);
    background: transparent;
    border-color: var(--de-btnSecondaryOutline)
}

.btn-outline-secondary:not(:disabled):hover, .btn-outline-secondary:not(:disabled):focus {
    background: var(--de-btnSecondaryOutlineHover);
    color: var(--de-bodyColor);
    border-color: var(--de-btnSecondaryBgHover)
}

.btn-outline-secondary:not(.disabled-as-active):disabled, .btn-outline-secondary:not(.disabled-as-active).disabled {
    opacity: 1;
    color: var(--de-mutedColor)
}

.btn-outline-secondary .disabled-as-active:disabled {
    opacity: 1
}

.btn-link {
    --de-btnLoaderBg: #1c56e5;
    background: none;
    color: #13f2ff;
    padding: 0;
    min-height: initial
}

.btn-link:hover, .btn-link:focus {
    color: var(--de-btnPrimaryBgHover)
}

.btn-text {
    --de-btnLoaderBg: var(--de-bodyColor);
    background: none;
    color: var(--de-bodyColor);
    padding: 0;
    min-height: initial
}

.btn-text:hover, .btn-text:focus {
    color: var(--de-bodyColor)
}

.copy-btn {
    padding: 0;
    color: var(--de-bodyColor);
    font-size: 14px;
    border: none;
    background: none;
    outline: none;
    box-shadow: none
}

@media (min-width: 1200px) {
    .copy-btn:hover {
        color: var(--de-iconColor)
    }
}

.copy-btn, .copy-text {
    position: relative
}

.copy-btn:after, .copy-text:after {
    content: var(--copy-text);
    position: absolute;
    left: 50%;
    top: 0;
    font-family: var(--de-fontFamily);
    font-size: 10px;
    line-height: 1;
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, -130%);
    white-space: nowrap
}

@media (max-width: 767.5px) {
    .copy-btn:hover:after, .copy-text:hover:after {
        animation: coppied 2s
    }
}

@media (min-width: 768px) {
    .copy-btn:focus:after, .copy-text:focus:after {
        animation: coppied 1.2s
    }
}

.token-list .copy-text:after {
    top: 100%;
    left: 0;
    transform: translateY(-10%)
}

@keyframes coppied {
    0% {
        opacity: 0;
        visibility: hidden
    }

    80% {
        opacity: 1;
        visibility: visible
    }

    to {
        opacity: 0;
        visibility: hidden
    }
}

@media (max-width: 768px) {
    .justify-in-mobile {
        width: 100%
    }

    .justify-in-mobile mat-button-toggle {
        flex: 1 1 auto
    }
}

.btn-has-loader.waiting:disabled {
    opacity: 1
}

.card-btn {
    background: var(--card-btn-bg);
    color: var(--de-bodyColor)
}

@media (min-width: 1200px) {
    .card-btn:hover {
        color: var(--de-primary)
    }
}

.close-btn {
    font-size: 1.6667rem;
    line-height: 1rem
}

.close-btn:hover {
    color: var(--de-primary)
}

.icon-square, .btn-square {
    padding: 0;
    min-height: var(--de-btnSizeMd);
    width: var(--de-btnSizeMd);
    flex: 0 0 var(--de-btnSizeMd);
    font-size: 14px
}

.icon-square {
    display: flex;
    align-items: center;
    justify-content: center;
    height: var(--de-btnSizeMd);
    border: 1px solid var(--de-btnSecondaryBgHover);
    border-radius: var(--de-borderRadiusSm);
    background: var(--de-btnSecondaryBg)
}

.icon-square[class^=icomoon-], .icon-square[class*=" icomoon-"] {
    color: var(--de-iconColor)
}

.btn-icon-table {
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    line-height: 1.25rem;
    background: rgba(122, 91, 186, .2);
    color: var(--theme-fontColor-60)
}

.btn-icon-table.text-error {
    background: #440E25;
    color: #cc2b4a
}

.light-mode .btn-icon-table.text-error {
    background: rgba(235, 87, 87, .2)
}

.btn-separated {
    display: flex;
    align-items: center
}

.btn-separated .btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 1px
}

.btn-separated .btn:not(:first-child):not(:last-child) {
    border-radius: 0;
    margin-right: 1px
}

.btn-separated .btn:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group-separated {
    display: inline-flex;
    align-items: center
}

.btn-group-separated .btn {
    margin-right: 1px
}

.btn-group-separated .btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.btn-group-separated .btn:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-right: 0
}

.btn-group-separated .btn:not(:first-child):not(:last-child) {
    border-radius: 0
}

.btn-reload:focus .icomoon-reload {
    animation: rotate 1s
}

.btn-close {
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    color: var(--de-primary);
    font-size: 24px;
    line-height: 1
}

.btn-close:after {
    content: "\e904";
    font-family: icomoon
}

.btn-close:hover {
    color: var(--de-bodyColor)
}

.btn-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--de-gapXs)
}

.btn-group-justified {
    display: grid;
    grid-column-gap: var(--de-gapMd)
}

.btn-indicator {
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background: var(--de-primary);
    position: absolute;
    top: -4px;
    right: -4px;
    border: 2px solid var(--de-bodyBg)
}

body {
    --button-toggle-bg: transparent;
    --button-toggle-hover-bg: var(--de-btnSecondaryBgDisabled);
    --button-toggle-checked-bg: var(--de-tabActiveBg, var(--de-btnSecondaryBg))
}

body .button-toggle-group {
    border: var(--de-borderWidth) solid var(--de-btnSecondaryOutline);
    border-radius: var(--de-borderRadiusSm)
}

body .mat-button-toggle {
    background: var(--button-toggle-bg);
    color: var(--de-mutedColor);
    display: flex;
    transition: all .2s
}

body .mat-button-toggle .mat-button-toggle-label-content {
    padding: calc(1rem - var(--de-borderWidth)) 2rem;
    font-size: var(--de-bodyFontSize);
    line-height: 1.3334rem;
    font-weight: 400
}

@media (max-width: 300px) {
    body .mat-button-toggle .mat-button-toggle-label-content {
        font-size: 12px
    }
}

body .mat-button-toggle:hover:not(.mat-button-toggle-checked) {
    color: var(--de-btnSecondaryTextColor);
    background: var(--button-toggle-hover-bg)
}

body .mat-button-toggle-checked {
    color: var(--de-btnSecondaryTextColor);
    background: var(--button-toggle-checked-bg)
}

body .mat-button-toggle .tag {
    position: absolute;
    top: 3px;
    right: 3px;
    font-size: 10px;
    padding: 2px 5px;
    min-height: initial
}

body .btns-justify {
    width: 100%
}

body .btns-justify .mat-button-toggle {
    flex: 1
}

body .btns-justify .mat-button-toggle-label-content {
    width: 100%;
    padding: calc(1rem - var(--de-borderWidth)) 1rem
}

@media (min-width: 768px) {
    body .btns-justify .mat-button-toggle-label-content {
        padding: calc(1rem - var(--de-borderWidth)) 2rem
    }
}

@media (max-width: 768px) {
    body .btns-justify-on-mobile {
        width: 100%
    }

    body .btns-justify-on-mobile .mat-button-toggle {
        flex: 1
    }

    body .btns-justify-on-mobile .mat-button-toggle-label-content {
        width: 100%;
        padding: calc(1rem - var(--de-borderWidth)) 1rem
    }
}

@media (max-width: 768px) and (min-width: 768px) {
    body .btns-justify-on-mobile .mat-button-toggle-label-content {
        padding: calc(1rem - var(--de-borderWidth)) 2rem
    }
}

input.mat-mdc-input-element, input {
    color: var(--de-bodyColor);
    font-family: var(--de-fontFamily);
    font-size: var(--de-bodyFontSize);
    line-height: 1.6667rem;
    caret-color: var(--de-bodyColor)
}

input.mat-mdc-input-element.hide-caret, input.hide-caret {
    caret-color: transparent !important
}

input.mat-mdc-input-element::-webkit-input-placeholder, input::-webkit-input-placeholder {
    color: var(--de-mutedColor)
}

input.mat-mdc-input-element:-moz-placeholder, input:-moz-placeholder {
    color: var(--de-mutedColor)
}

input.mat-mdc-input-element::-moz-placeholder, input::-moz-placeholder {
    color: var(--de-mutedColor)
}

input.mat-mdc-input-element:-ms-input-placeholder, input:-ms-input-placeholder {
    color: var(--de-mutedColor)
}

.form-row {
    margin-right: -6px;
    margin-left: -6px;
    display: flex;
    flex-wrap: wrap
}

.form-row>* {
    padding-right: 6px;
    padding-left: 6px
}

label.label-above {
    display: inline-block;
    font-size: var(--de-bodyFontSize);
    color: var(--de-mutedColor);
    margin: 0 0 .5em
}

label.label-above .de-tooltip-content {
    text-transform: none
}

.req {
    color: var(--de-error)
}

.form-group {
    margin-bottom: var(--de-gapMd);
    position: relative
}

.form-group .error {
    color: var(--de-error);
    font-size: var(--de-bodyFontSize);
    padding: 4px 9px 0
}

.form-group .float-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    padding: 9px var(--de-gapMd);
    color: var(--de-mutedColor);
    cursor: text
}

.form-group__suffix {
    position: absolute;
    right: var(--de-gapMd)
}

input.placeholder-uppercase::-webkit-input-placeholder, .placeholder-uppercase::-webkit-input-placeholder {
    text-transform: uppercase;
    text-align: center
}

input.placeholder-uppercase:-moz-placeholder, .placeholder-uppercase:-moz-placeholder {
    text-transform: uppercase;
    text-align: center
}

input.placeholder-uppercase::-moz-placeholder, .placeholder-uppercase::-moz-placeholder {
    text-transform: uppercase;
    text-align: center
}

input.placeholder-uppercase:-ms-input-placeholder, .placeholder-uppercase:-ms-input-placeholder {
    text-transform: uppercase;
    text-align: center
}

.form-control, .color-picker-control, .mat-select-simple .mat-mdc-select-trigger {
    display: inline-flex;
    width: 100%;
    padding: 4px var(--de-gapMd);
    border: var(--de-borderWidth) solid var(--de-controlBorder);
    border-radius: var(--de-borderRadiusSm);
    background: var(--de-bodyBg);
    height: var(--de-btnSizeMd);
    align-items: center;
    color: var(--de-bodyColor);
    font-family: var(--de-fontFamily);
    font-size: var(--de-bodyFontSize);
    line-height: 1.6667rem
}

.form-control:focus, .color-picker-control:focus, .mat-select-simple .mat-mdc-select-trigger:focus {
    outline: none;
    box-shadow: none
}

.form-control-lg, .color-picker-control-lg, .mat-select-simple .mat-mdc-select-trigger-lg {
    padding: 1.669rem 1.5rem
}

.form-control-sm, .color-picker-control-sm, .mat-select-simple .mat-mdc-select-trigger-sm {
    padding: .3334rem .6667rem;
    font-size: var(--de-bodyFontSizeSm);
    line-height: 1.16667;
    border-radius: var(--de-borderRadiusSm);
    height: var(--de-btnSizeSm)
}

.form-control-xs, .color-picker-control-xs, .mat-select-simple .mat-mdc-select-trigger-xs {
    padding: .3334rem .6667rem;
    font-size: var(--de-bodyFontSizeSm);
    line-height: 1.16667;
    border-radius: var(--de-borderRadiusSm)
}

.invalid-border.ng-touched.mat-form-field-invalid .mdc-text-field, .invalid-border.form-control {
    box-shadow: inset 0 0 0 1px var(--de-error)
}

.warning-border.ng-touched.ng-invalid, .warning-border.form-control {
    box-shadow: inset 0 0 0 1px var(--de-warning)
}

.form-error {
    color: var(--de-error)
}

textarea {
    max-width: 100%
}

textarea.no-resize {
    resize: none
}

.mat-mdc-form-field {
    display: block;
    width: 100%
}

.mat-mdc-form-field .mdc-line-ripple {
    display: none
}

.mat-mdc-form-field .mat-mdc-form-field-flex {
    align-items: center
}

.mat-mdc-form-field .mat-mdc-text-field-wrapper {
    padding: 0
}

.mat-mdc-form-field .mdc-text-field {
    display: inline-flex;
    width: 100%;
    padding: 4px var(--de-gapMd);
    border: var(--de-borderWidth) solid var(--de-controlBorder);
    border-radius: var(--de-borderRadiusSm);
    background: var(--de-bodyBg);
    height: var(--de-btnSizeMd);
    align-items: center;
    color: var(--de-bodyColor);
    font-family: var(--de-fontFamily);
    font-size: var(--de-bodyFontSize);
    line-height: 1.6667rem
}

.mat-mdc-form-field .mdc-text-field .mdc-floating-label {
    color: var(--de-mutedColor);
    transform: translateY(-50%) !important
}

.mat-mdc-form-field .mdc-text-field .mdc-floating-label--float-above {
    display: none
}

.mat-mdc-form-field input.mat-mdc-input-element {
    margin: 0
}

.mat-mdc-form-field .mat-hint, .mat-mdc-form-field.mat-focused .mat-form-field-label {
    color: var(--de-mutedColor)
}

.mat-mdc-form-field.mat-form-field.mat-warn .mat-input-element, .mat-mdc-form-field.mat-form-field-invalid .mat-input-element, .light-mode .mat-mdc-form-field.mat-form-field.mat-warn .mat-input-element, .light-mode .mat-mdc-form-field.mat-form-field-invalid .mat-input-element {
    caret-color: var(--de-error)
}

.mat-mdc-form-field.mat-form-field.mat-warn .mat-form-field-label, .mat-mdc-form-field.mat-form-field-invalid .mat-form-field-label, .light-mode .mat-mdc-form-field.mat-form-field.mat-warn .mat-form-field-label, .light-mode .mat-mdc-form-field.mat-form-field-invalid .mat-form-field-label {
    color: var(--de-mutedColor)
}

.mat-mdc-form-field.chip-select-group .mdc-evolution-chip-set .mdc-evolution-chip:first-child {
    margin-left: 0
}

.mat-mdc-form-field.chip-select-group .mdc-text-field {
    height: auto;
    min-height: var(--de-btnSizeMd);
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 8px
}

.mat-mdc-form-field.chip-select-group .mdc-text-field .mat-mdc-chip-input {
    padding-left: var(--de-gapSm)
}

.mat-mdc-form-field.form-field-lg .mdc-text-field {
    padding: 1.3334rem 1rem
}

.mat-mdc-form-field.form-field-lg input {
    line-height: 1.4
}

.mat-mdc-form-field.form-field-lg.chip-select-group .mdc-text-field {
    padding: .8354rem 1rem
}

.mat-mdc-form-field.form-field-uppercase {
    text-transform: uppercase
}

.mat-mdc-form-field.text-center .mat-mdc-floating-label {
    width: 100%;
    text-align: center
}

.mat-mdc-form-field.mat-mdc-form-field-has-icon-suffix.text-center .mat-mdc-text-field-wrapper {
    padding-right: 1rem;
    padding-left: 3rem
}

.mat-mdc-form-field.mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper {
    padding-right: var(--de-gapMd)
}

.mat-mdc-form-field .mat-mdc-form-field-bottom-align:before {
    content: none
}

.mat-mdc-form-field.active .mdc-text-field {
    outline: 1px solid var(--de-primary)
}

.mat-mdc-form-field .mat-mdc-form-field-icon-prefix, .mat-mdc-form-field .mat-mdc-form-field-icon-suffix {
    color: var(--de-mutedColor)
}

.mat-mdc-form-field .mat-mdc-form-field-icon-prefix>.mat-icon, .mat-mdc-form-field .mat-mdc-form-field-icon-suffix>.mat-icon {
    display: flex;
    padding: 0;
    width: auto;
    height: auto;
    font-size: 16px;
    line-height: 16px
}

.mat-mdc-form-field .mat-mdc-form-field-icon-prefix>.mat-icon.disabled, .mat-mdc-form-field .mat-mdc-form-field-icon-suffix>.mat-icon.disabled {
    opacity: .5
}

.mat-mdc-form-field .mat-mdc-form-field-icon-prefix>.mat-icon img, .mat-mdc-form-field .mat-mdc-form-field-icon-suffix>.mat-icon img {
    width: 16px;
    height: 16px;
    display: block
}

.mat-mdc-form-field.mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper {
    padding: .792rem 1rem;
    line-height: 1
}

.mat-mdc-form-field.has-tag .mdc-text-field {
    padding-left: var(--de-gapSm);
    padding-right: var(--de-gapSm)
}

.input-group {
    position: relative;
    display: flex;
    align-items: center
}

.input-group .form-control {
    flex: 1 1 auto
}

.input-group .btn {
    margin-right: 16px
}

.input-group .input-group-icon, .input-group .input-group-loader {
    position: absolute;
    top: 50%;
    right: var(--de-gapMd);
    transform: translateY(-50%)
}

.input-group-selected {
    position: absolute !important;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    height: auto;
    padding: 2px 6px;
    text-transform: initial;
    cursor: text;
    padding-right: 2rem;
    z-index: 1
}

@media (max-width: 767.5px) {
    .input-group-selected {
        padding: 5px 2rem 5px 8px;
        font-size: 14px
    }
}

@media (min-width: 768px) {
    .input-group-selected.btn-primary:hover {
        background: var(--de-primary)
    }
}

@media (min-width: 2560px) {
    .input-group-selected {
        left: 14px
    }
}

.input-group-selected .icon {
    display: inline-block;
    font-size: 10px;
    line-height: 1;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    font-weight: 700;
    margin-left: .6667rem
}

.input-group-selected .icon:not(:disabled):hover {
    color: var(--de-error)
}

.input-group-selected .icon:disabled {
    cursor: default;
    opacity: .5
}

.input-group-selected+.form-control {
    color: #0000;
    text-indent: -9999px
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
    font-family: var(--de-fontFamily) !important;
    -webkit-transition: background-color 600000s 0s;
    transition: background-color 600000s 0s;
    -webkit-text-fill-color: var(--de-bodyColor) !important
}

input:-webkit-autofill:first-line {
    font-size: var(--de-bodyFontSize);
    font-family: var(--de-fontFamily)
}

.form-hint {
    font-size: 12px;
    color: var(--de-mutedColor)
}

.form-suffix {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--de-bodyColor);
    font-family: inherit;
    font-size: var(--de-bodyFontSize);
    opacity: .5
}

.input-group-search {
    position: relative
}

.input-group-search input:placeholder-shown {
    text-overflow: ellipsis
}

.input-group-search .form-control {
    padding-right: 3rem
}

.input-group-search .input-group-icon {
    font-size: 1.333334rem
}

.input-group-search .input-group-icon:first-child {
    left: var(--de-gapMd);
    right: auto
}

body .mat-list-base {
    padding-top: 0
}

body .mat-list-base .mat-list-item, body .mat-list-base .mat-list-option {
    height: initial;
    margin-bottom: .5rem
}

body .mat-list-base .mat-list-item:last-child, body .mat-list-base .mat-list-option:last-child {
    margin-bottom: 0
}

body .mat-list-base .mat-list-item .mat-list-item-content, body .mat-list-base .mat-list-option .mat-list-item-content {
    padding: 0
}

body .mat-list-base .mat-list-item .mat-list-item-content .mat-ripple, body .mat-list-base .mat-list-option .mat-list-item-content .mat-ripple {
    display: none
}

body .mat-list-base .mat-list-item .mat-list-item-content .mat-list-text, body .mat-list-base .mat-list-option .mat-list-item-content .mat-list-text {
    padding-left: .5rem !important;
    color: var(--theme-fontColor-50);
    font-size: 1rem;
    line-height: 1.3;
    font-weight: 400
}

body .mat-list-base .mat-list-item:hover .mat-list-item-content .mat-list-text, body .mat-list-base .mat-list-item .mat-pseudo-checkbox-checked+.mat-list-text, body .mat-list-base .mat-list-option:hover .mat-list-item-content .mat-list-text, body .mat-list-base .mat-list-option .mat-pseudo-checkbox-checked+.mat-list-text {
    color: var(--de-bodyColor)
}

body .mat-list-base .mat-list-item:hover .mat-pseudo-checkbox, body .mat-list-base .mat-list-option:hover .mat-pseudo-checkbox {
    color: var(--de-primary)
}

body .mat-list-base .mat-list-item:hover, body .mat-list-base .mat-list-item:focus, body .mat-list-base .mat-list-option:hover, body .mat-list-base .mat-list-option:focus {
    background: none
}

body .mat-list-base .mat-list-item-disabled {
    background: none;
    opacity: .3
}

body .mat-list-base.selection-list-2-col {
    display: flex;
    flex-wrap: wrap
}

body .mat-list-base.selection-list-2-col .mat-list-option {
    width: 50%
}

.disabled-opacity:disabled, .disabled-opacity.disabled, .disabled-opacity.mat-mdc-checkbox-disabled {
    opacity: .5
}

.form-control-frame, .form-control-accent-frame {
    display: inline-flex;
    width: 100%;
    padding: 4px var(--de-gapMd);
    border: var(--de-borderWidth) solid var(--de-controlBorder);
    border-radius: var(--de-borderRadiusSm);
    background: var(--de-bodyBg);
    height: var(--de-btnSizeMd);
    color: var(--de-bodyColor);
    font-family: var(--de-fontFamily);
    font-size: var(--de-bodyFontSize);
    line-height: 1.6667rem;
    display: flex;
    align-items: center
}

.form-control-frame__title, .form-control-frame__value, .form-control-accent-frame__title, .form-control-accent-frame__value {
    font-size: var(--de-h2FontSize);
    font-weight: 500
}

.form-control-accent-frame {
    padding: var(--de-gapMd);
    background: var(--de-controlBg);
    height: var(--de-btnSizeLg)
}

.form-control-accent-frame__title, .form-control-accent-frame__value {
    color: var(--de-mutedColor)
}

.textarea-copy {
    display: inline-flex;
    padding: 4px var(--de-gapMd);
    border: var(--de-borderWidth) solid var(--de-controlBorder);
    border-radius: var(--de-borderRadiusSm);
    background: var(--de-bodyBg);
    height: var(--de-btnSizeMd);
    align-items: center;
    color: var(--de-bodyColor);
    font-family: var(--de-fontFamily);
    font-size: var(--de-bodyFontSize);
    line-height: 1.6667rem;
    align-items: flex-start;
    display: flex;
    width: 100%;
    height: 120px;
    overflow-y: auto;
    overflow-x: hidden
}

.textarea-copy__input {
    color: var(--de-mutedColor);
    word-wrap: break-word;
    word-break: break-word;
    width: calc(100% - 4rem);
    flex: 0 0 calc(100% - 4rem)
}

.textarea-copy__btn {
    position: sticky;
    top: var(--de-gapXs);
    right: var(--de-gapSm);
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 16px
}

.mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper, .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper {
    position: static
}

body {
    --mdc-checkbox-size: var(--de-controlSize);
    --mdc-checkbox-state-layer-size: 0;
    --mdc-checkbox-unselected-icon-color: var(--de-controlBorder);
    --mdc-checkbox-unselected-hover-icon-color: var(--de-controlBorder);
    --mdc-checkbox-unselected-focus-icon-color: var(--de-controlBorder);
    --mdc-checkbox-unselected-pressed-icon-color: var(--de-controlBorder);
    --mdc-checkbox-unselected-hover-bg: var(--de-controlBorder);
    --mdc-checkbox-selected-icon-color: var(--de-btnPrimaryBg);
    --mdc-checkbox-selected-hover-icon-color: var(--de-btnPrimaryBg);
    --mdc-checkbox-selected-focus-icon-color: var(--de-btnPrimaryBg);
    --mdc-checkbox-selected-pressed-icon-color: var(--de-btnPrimaryBg);
    --mdc-checkbox-selected-checkmark-color: var(--de-btnPrimaryTextColor);
    --mdc-checkbox-disabled-unselected-icon-color: var(--de-controlBorder);
    --mdc-checkbox-disabled-selected-icon-color: var(--de-btnPrimaryBgDisabled);
    --mdc-checkbox-disabled-selected-checkmark-color: var(--de-btnPrimaryTextColorDisabled)
}

body .mat-mdc-checkbox .mdc-checkbox, body .mat-mdc-list-option .mdc-checkbox {
    width: var(--mdc-checkbox-size);
    height: var(--mdc-checkbox-size)
}

body .mat-mdc-checkbox .mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox__background {
    width: var(--mdc-checkbox-size);
    height: var(--mdc-checkbox-size);
    border: 1px solid var(--de-borderColor);
    border-radius: var(--de-borderRadiusSm)
}

body .mat-mdc-checkbox .mdc-checkbox__checkmark, body .mat-mdc-list-option .mdc-checkbox__checkmark {
    width: 12px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

body .mat-mdc-checkbox .mdc-checkbox__ripple, body .mat-mdc-list-option .mdc-checkbox__ripple {
    display: none
}

body .mat-mdc-checkbox .mdc-checkbox-touch-target, body .mat-mdc-list-option .mdc-checkbox-touch-target {
    width: var(--mdc-checkbox-size);
    height: var(--mdc-checkbox-size)
}

body .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background {
    background: var(--de-controlBg)
}

body .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background, body .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background, body .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background {
    border-color: transparent;
    background: var(--de-btnPrimaryBg)
}

body .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background {
    background-color: var(--de-controlBgHover);
    opacity: .6
}

body .mat-mdc-checkbox .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox:not(:disabled):active .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background {
    background-color: var(--de-controlBgHover)
}

body .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background, body .mat-mdc-list-option .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background {
    background-color: var(--mdc-checkbox-unselected-hover-bg)
}

.mat-mdc-checkbox .mdc-form-field>label {
    padding-left: var(--de-gapSm)
}

.mat-mdc-selection-list {
    --mdc-list-list-item-one-line-container-height: auto;
    --mdc-list-list-item-container-shape: 2px;
    --mdc-list-list-item-label-text-color: var(--de-mutedColor);
    --mdc-list-list-item-focus-label-text-color: var(--de-bodyColor)
}

.mat-mdc-selection-list.mdc-list {
    padding: 0
}

.mat-mdc-selection-list .mdc-list-item {
    padding-right: 0;
    margin: 0 0 var(--de-gapXs)
}

.mat-mdc-selection-list .mdc-list-item .iaas-badge {
    margin-left: .5rem;
    padding: 2px 5px;
    font-size: 10px
}

.mat-mdc-selection-list .mdc-list-item .iaas-badge .icomoon-iaas {
    font-size: inherit
}

.mat-mdc-selection-list .mdc-list-item--with-leading-checkbox .mdc-list-item__start {
    margin-left: 0;
    margin-right: .6667rem
}

body {
    --mdc-switch-track-width: 36px;
    --mdc-switch-track-height: 20px;
    --mdc-switch-track-shape: 10px;
    --mdc-switch-handle-width: 14px;
    --mdc-switch-handle-height: 14px;
    --mdc-switch-handle-shape: 100%;
    --mdc-switch-state-layer-size: 40px;
    --mdc-switch-unselected-track-color: var(--de-controlBg);
    --mdc-switch-unselected-focus-track-color: var(--de-controlBg);
    --mdc-switch-unselected-hover-track-color: var(--de-controlBgHover);
    --mdc-switch-unselected-pressed-track-color: var(--de-controlBg);
    --mdc-switch-unselected-pressed-state-layer-color: var(--de-controlBg);
    --mdc-switch-unselected-handle-color: var(--de-controlHandle);
    --mdc-switch-unselected-focus-handle-color: var(--de-controlHandle);
    --mdc-switch-unselected-hover-handle-color: var(--de-controlHandle);
    --mdc-switch-unselected-pressed-handle-color: var(--de-controlHandle);
    --mdc-switch-selected-hover-track-color: var(--de-controlBgActive);
    --mdc-switch-selected-handle-color: var(--de-controlHandleActive);
    --mdc-switch-selected-focus-handle-color: var(--de-controlHandleActive);
    --mdc-switch-selected-hover-handle-color: var(--de-controlHandleActive);
    --mdc-switch-selected-pressed-handle-color: var(--de-controlHandleActive);
    --mdc-switch-disabled-selected-handle-color: var(--de-controlHandleActive);
    --mdc-switch-selected-track-color: var(--de-controlBgActive);
    --mdc-switch-selected-focus-track-color: var(--de-controlBgActive);
    --mdc-switch-selected-pressed-track-color: var(--de-controlBgActive);
    --mdc-switch-handle-surface-color: var(--de-controlHandle);
    --mdc-switch-disabled-unselected-track-color: var(--de-controlBg);
    --mdc-switch-disabled-unselected-handle-color: var(--de-controlHandle);
    --mdc-switch-disabled-selected-track-color: var(--de-controlBgActive);
    --mdc-switch-disabled-track-opacity: .6;
    --mdc-switch-disabled-handle-opacity: .6
}

.mat-slide-toggle-thumb {
    box-shadow: none !important
}

.mat-slide-toggle-content {
    font-size: var(--text-size-lg);
    line-height: 20px;
    overflow: initial !important;
    white-space: initial !important
}

.mat-slide-toggle-content a {
    color: inherit
}

.mat-mdc-slide-toggle .mdc-switch__shadow, .mat-mdc-slide-toggle .mdc-switch__icons, .mat-mdc-slide-toggle .mdc-switch__ripple, .mat-mdc-slide-toggle .mdc-switch__handle:before {
    display: none
}

.mat-mdc-slide-toggle .mdc-switch__handle:before, .mat-mdc-slide-toggle .mdc-switch__handle:after {
    border: none
}

.mat-mdc-slide-toggle .mdc-switch__track:before {
    border: 1px solid var(--mdc-switch-unselected-track-color)
}

.mat-mdc-slide-toggle .mdc-switch__track:after {
    border: 1px solid var(--mdc-switch-selected-track-color)
}

.mat-mdc-slide-toggle .mdc-switch__handle-track {
    left: 3px
}

.mat-mdc-slide-toggle .mdc-switch--selected .mdc-switch__handle-track {
    transform: translate(calc(100% - 3px));
    left: 0
}

.mat-mdc-slide-toggle .mdc-form-field>label {
    padding-left: 8px
}

.color-picker-control {
    display: flex !important;
    align-items: center;
    padding: .5rem;
    cursor: pointer;
    white-space: nowrap
}

.color-picker-value {
    overflow: hidden;
    text-overflow: ellipsis
}

.color-picker-input {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border: 1px solid #999999;
    border-radius: var(--de-borderRadiusSm);
    padding: 0;
    margin: 0 8px 0 0;
    cursor: pointer;
    font-size: 0
}

body .color-picker {
    background-color: var(--de-dropdownBg);
    border: none;
    border-radius: var(--de-borderRadius);
    box-shadow: 0 0 15px 2px #ffffff03
}

.light-mode body .color-picker {
    box-shadow: 0 0 15px 2px #00000003
}

body .color-picker .saturation-lightness {
    border-radius: 8px 8px 0 0
}

body .color-picker .arrow.arrow-right-top, body .color-picker .arrow.arrow-top-right {
    border-color: transparent var(--de-bodyBg) transparent transparent
}

body .color-picker .arrow.arrow-bottom-right, body .color-picker .arrow.arrow-right, body .color-picker .arrow.arrow-right-bottom {
    border-color: transparent #EEEEEE transparent transparent
}

body .color-picker input {
    display: inline-block;
    width: 100%;
    padding: 8px;
    border-radius: var(--de-borderRadius);
    border: 1px solid var(--de-secondary) !important;
    background: var(--de-bodyBg);
    color: var(--de-bodyColor);
    font-family: inherit;
    font-size: var(--de-bodyFontSize);
    line-height: 24px
}

body .color-picker input:focus {
    outline: none;
    border: 1px solid var(--de-secondary) !important
}

.mat-mdc-select.auto-width {
    width: auto
}

.mat-mdc-select.small-radius {
    border-radius: var(--de-borderRadiusSm)
}

.mat-mdc-select.mat-select-uppercase .mat-mdc-select-trigger {
    text-transform: uppercase
}

.mat-mdc-select[aria-expanded=true] .mat-mdc-select-trigger .mat-mdc-select-arrow:after {
    content: "\e927"
}

.mat-mdc-select-trigger {
    padding: 10px 20px;
    font-size: var(--de-bodyFontSize);
    line-height: var(--de-bodyLineHeight);
    font-weight: 400;
    border-radius: var(--de-borderRadiusSm);
    border: 1px solid var(--de-borderColor);
    cursor: pointer !important;
    -webkit-user-select: none;
    user-select: none;
    transition: all .3s
}

.mat-mdc-select-trigger .mat-mdc-select-value-text {
    font-size: var(--de-bodyFontSize);
    color: var(--de-bodyColor)
}

.mat-mdc-select-trigger .mat-mdc-select-arrow-wrapper {
    height: auto
}

.mat-mdc-select-trigger .mat-mdc-select-arrow {
    border: none;
    width: auto;
    height: auto;
    margin: 0 0 0 var(--de-gapSm)
}

.mat-mdc-select-trigger .mat-mdc-select-arrow svg {
    display: none
}

.mat-mdc-select-trigger .mat-mdc-select-arrow:after {
    content: "\e928";
    font-family: icomoon;
    line-height: 1;
    vertical-align: middle;
    color: var(--de-mutedColor)
}

.mat-mdc-option .mdc-list-item__primary-text {
    width: 100%
}

body .cdk-overlay-pane:not(.mat-mdc-autocomplete-panel-above) .mdc-menu-surface.mat-mdc-autocomplete-panel, body .cdk-overlay-pane:not(.mat-mdc-select-panel-above) .mdc-menu-surface.mat-mdc-select-panel {
    border-radius: var(--de-borderRadiusSm)
}

body .mat-mdc-select-panel-above .mdc-menu-surface.mat-mdc-select-panel {
    border-radius: var(--de-borderRadiusSm)
}

body .mdc-menu-surface.mat-mdc-autocomplete-panel, body .mdc-menu-surface.mat-mdc-select-panel {
    padding: 0;
    margin: var(--de-gapXs) 0;
    min-width: auto
}

body .mdc-menu-surface.mat-mdc-autocomplete-panel:before, body .mdc-menu-surface.mat-mdc-select-panel:before {
    content: none
}

.mdc-menu-surface {
    --button-toggle-checked-bg: var(--de-btnSecondaryBg);
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: var(--de-dropdownBg);
    color: var(--de-bodyColor);
    border-radius: var(--de-borderRadiusSm);
    border: 1px solid var(--de-borderColor);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: transform .2s ease-out, visibility .1s ease-out, opacity .2s;
    z-index: 900;
    visibility: visible
}

.mdc-menu-surface:before {
    content: "";
    position: absolute;
    top: -1rem;
    left: 0;
    height: 1rem;
    width: 100%
}

.mdc-menu-surface.active-on-hover:not(.active):not(:hover) {
    pointer-events: none
}

.mdc-menu-surface:before {
    content: none
}

.mdc-menu-surface .mat-mdc-option {
    padding: 10px 20px;
    font-size: var(--de-bodyFontSize);
    line-height: var(--de-bodyLineHeight);
    font-weight: 400;
    min-height: auto;
    border-bottom: 1px solid var(--de-borderColor)
}

.mdc-menu-surface .mat-mdc-option:last-child {
    border-bottom: none
}

.mdc-menu-surface .mat-mdc-option .mat-pseudo-checkbox {
    display: none
}

.mdc-menu-surface .mat-mdc-option.mdc-list-item--selected:not(.mat-option-multiple) {
    background: var(--de-dropdownBg) !important;
    color: var(--de-mutedColor)
}

.mdc-menu-surface .mat-mdc-option:hover:not(.mat-option-disabled):not(.mdc-list-item--selected) {
    background: var(--de-dropdownBgHover);
    color: var(--de-dropdownColor)
}

.mdc-menu-surface .mat-mdc-option .mat-option-text {
    display: flex;
    align-items: center
}

.mdc-menu-surface .mat-mdc-option .mat-option-text img {
    height: 1.6667rem;
    width: 1.6667rem;
    margin-right: .5rem
}

.small-radius-panel {
    border-radius: var(--de-borderRadiusSm) !important
}

app-networks-list button {
    padding: 0;
    background: none;
    border: none
}

div.mat-select-panel-network {
    border-radius: 4px !important
}

@media (max-width: 1199.5px) {
    div.mat-select-panel-network {
        margin-top: 36px
    }
}

.mat-autocomplete-input {
    position: relative
}

.mat-autocomplete-input:after {
    content: "\e94a";
    display: block;
    font-family: icomoon;
    font-size: 16px;
    line-height: 1;
    position: absolute;
    top: 50%;
    right: 1.3333rem;
    transform: translateY(-50%)
}

.option-not-found.mat-option-disabled {
    color: var(--de-bodyColor)
}

.mat-mdc-autocomplete-panel {
    --button-toggle-checked-bg: var(--de-btnSecondaryBg);
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: var(--de-dropdownBg);
    color: var(--de-bodyColor);
    border-radius: var(--de-borderRadiusSm);
    border: 1px solid var(--de-borderColor);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: transform .2s ease-out, visibility .1s ease-out, opacity .2s;
    z-index: 900
}

.mat-mdc-autocomplete-panel:before {
    content: "";
    position: absolute;
    top: -1rem;
    left: 0;
    height: 1rem;
    width: 100%
}

.mat-mdc-autocomplete-panel.active-on-hover:not(.active):not(:hover) {
    pointer-events: none
}

.mat-mdc-autocomplete-panel .mat-option {
    padding: 1rem;
    color: var(--de-bodyColor);
    height: auto;
    font-size: var(--de-bodyFontSize);
    font-weight: 400;
    line-height: 1.25;
    border-bottom: 1px solid var(--de-borderColor)
}

.mat-mdc-autocomplete-panel .mat-option:last-child {
    border-bottom: none
}

.mat-mdc-autocomplete-panel .mat-option-text {
    display: flex;
    align-items: center
}

.mat-mdc-autocomplete-panel .mat-option-text img {
    margin-right: .5rem
}

body {
    --mdc-dialog-container-color: var(--de-modalBg);
    --mdc-dialog-container-shape: var(--de-borderRadius);
    --mdc-dialog-container-elevation: none
}

body.modal-opened:not(.dln-modal-opened) {
    overflow: hidden;
    padding-right: var(--scrollbar-width)
}

@media (max-width: 767.5px) {
    body.modal-opened:not(.dln-modal-opened) app-root {
        opacity: 0;
        visibility: hidden;
        max-height: var(--app-height);
        overflow: hidden
    }
}

body .cdk-overlay-backdrop {
    background: var(--de-modalBackdrop)
}

body .mat-mdc-dialog-container .mdc-dialog__surface {
    box-shadow: none;
    border: 1px solid var(--de-borderColor)
}

body .mat-mdc-dialog-container .mdc-dialog__surface:before {
    border: none
}

body .mat-mdc-dialog-container .pseudo-modal {
    border: none
}

body .mat-modal-panel {
    width: calc(100% - var(--bs-gutter-x));
    max-width: 500px !important
}

body .dlg-lg {
    width: calc(100% - var(--bs-gutter-x));
    max-width: 600px !important
}

@media (max-width: 576px) {
    body .dlg-full-on-mob {
        max-width: 100% !important;
        width: 100%;
        height: 100%;
        border: none;
        border-radius: 0
    }

    body .dlg-full-on-mob .mdc-dialog__surface {
        border: none;
        padding-top: 1rem
    }
}

@media (max-width: 1199.5px) {
    .mat-dialog-container {
        transform: none !important
    }

    .mat-modal-backdrop {
        transition: none !important
    }

    .cdk-overlay-pane {
        transform: none;
        animation: none
    }

    .cdk-overlay-container>* {
        transition: none
    }
}

.mat-modal-backdrop {
    background: var(--de-modalBackdrop);
    transition: opacity .2s linear
}

@media (min-width: 768px) {
    .mat-modal-backdrop {
        transition: opacity .4s cubic-bezier(.25, .8, .25, 1)
    }
}

@media screen and (max-width: 767.5px) {
    .mob-menu-active .mat-close-from-header {
        display: none
    }
}

.modal-title, .mat-dialog-title {
    font-weight: 500;
    font-size: var(--de-titleFontSize);
    line-height: 1.4
}

.dlg-scroll {
    overflow-y: auto;
    overflow-x: hidden
}

.dlg-medium {
    max-width: 100% !important;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden
}

@media (min-width: 768px) {
    .dlg-medium {
        width: var(--de-modalWidth)
    }
}

@media (max-width: 768px) {
    .dlg-center {
        margin: auto
    }

    .dlg-center .mat-dialog-container {
        position: static
    }
}

@media screen and (max-width: 767.5px) {
    .wagmi-balance-error app-alert {
        padding-top: 0
    }

    .wagmi-balance-error .mat-close-btn {
        display: none
    }
}

.modal-header {
    display: flex;
    align-items: center;
    padding: var(--de-cardPadding);
    position: relative
}

.modal-header .modal-title {
    flex: 1
}

.modal-header .modal-title:first-child.text-center {
    padding-left: 3rem
}

.modal-header .modal-title:last-child.text-center {
    padding-right: 3rem
}

.modal-header+.modal-body {
    padding-top: 0
}

.modal-body, .modal-footer {
    padding: var(--de-cardPadding)
}

.modal-back-btn, .modal-close-btn {
    border: none;
    padding: 0;
    background: none;
    color: var(--de-mutedColor);
    font-size: 1rem
}

.modal-back-btn:disabled, .modal-back-btn.disabled, .modal-close-btn:disabled, .modal-close-btn.disabled {
    opacity: .5
}

.modal-back-btn:hover, .modal-close-btn:hover {
    color: var(--de-iconColor)
}

.modal-back-btn.modal-close-abs, .modal-close-btn.modal-close-abs {
    position: absolute;
    right: 1.6667rem;
    top: 1.6667rem
}

.modal-back-btn {
    margin-right: 1rem
}

.modal-wrap>.modal-close-btn {
    position: absolute;
    right: var(--de-cardPadding);
    top: var(--de-cardPadding)
}

.modal-subtitle {
    font-size: var(--h2-text-size)
}

@media (min-width: 768px) {
    .batch-unlock-warning .modal-text {
        max-width: 90%;
        margin-left: auto !important;
        margin-right: auto !important
    }
}

.modal-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0 auto;
    width: 5.3333rem;
    height: 5.3333rem;
    font-size: 2rem;
    line-height: 1;
    text-align: center;
    background: var(--badge-bg-icon);
    border-radius: 100%;
    color: var(--de-bodyColor)
}

.modal-icon img {
    width: 2rem;
    height: 2rem;
    object-fit: contain;
    border-radius: 100%
}

.modal-icon.loading-icon {
    width: 80px;
    height: 80px;
    background: none
}

.modal-icon.loading-icon:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(pending.c2380b9bbcd6a272.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    animation: rotate 1.5s infinite linear
}

body .dln-modal-backdrop {
    background: var(--de-bodyBg)
}

body .dln-modal {
    max-height: initial;
    --mdc-dialog-container-color: none;
    z-index: 2
}

body .dln-modal .mat-dialog-container {
    background: var(--body-bg);
    height: 100%
}

body .dln-modal .cdk-overlay-container {
    z-index: 1;
    position: absolute
}

body .dln-modal~#dln-form-container, body .dln-modal+#dln-form-container {
    display: none
}

body.dln-modal-opened .form-container {
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1
}

@media (min-width: 1366px) {
    body.dln-modal-opened .is-show-orders-table .dln-modal {
        width: 480px
    }
}

@media (min-width: 1536px) {
    body.dln-modal-opened .is-show-orders-table .dln-modal {
        width: var(--de-modalWidth)
    }
}

@media (max-width: 767.5px) {
    body.simple-mode-extended .dln-modal {
        margin-bottom: auto
    }
}

.pseudo-modal {
    border: var(--de-borderWidth) solid var(--de-borderColor);
    border-radius: var(--de-borderRadius)
}

.tooltip-icon {
    background: none;
    border: none;
    padding: 0;
    transition: color .3s;
    font-size: 14px;
    line-height: 16px;
    color: var(--de-mutedColor)
}

.tooltip-icon:hover, .tooltip-icon:active {
    color: var(--de-iconColor)
}

.de-tooltip-content, .mat-tooltip {
    background: var(--de-tooltipBg);
    color: var(--de-tooltipColor);
    box-shadow: 0 16px 16px 4px #1018280f;
    border-radius: var(--de-borderRadius);
    font-size: var(--de-bodyFontSize);
    line-height: 1.33;
    font-weight: 400;
    padding: 1rem;
    overflow: visible
}

.mat-tooltip {
    padding: 16px !important;
    overflow: visible !important
}

.de-tooltip-content, .tooltip-bottom {
    position: relative
}

.de-tooltip-content:before, .tooltip-bottom:before {
    content: "";
    width: 0;
    height: 0;
    border: .4rem solid transparent;
    border-bottom: .4rem solid var(--de-tooltipBg);
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -100%);
    z-index: -1
}

.de-tooltip {
    position: relative
}

.de-tooltip:not(.de-tooltip-block):not(.hstack) {
    display: inline-block;
    line-height: 1;
    text-transform: none
}

.de-tooltip.active>.de-tooltip-content, .de-tooltip:hover:not(.de-tooltip-click)>.de-tooltip-content {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%)
}

.de-tooltip.active>.de-tooltip-content.table-tooltip-content, .de-tooltip:hover:not(.de-tooltip-click)>.de-tooltip-content.table-tooltip-content {
    transform: translate(0)
}

.de-tooltip[data-position=left] .de-tooltip-content, .de-tooltip[data-position=right] .de-tooltip-content {
    top: 50%;
    transform: translate(20px, -50%);
    margin-top: 0
}

.de-tooltip[data-position=left] .de-tooltip-content:before, .de-tooltip[data-position=right] .de-tooltip-content:before {
    top: 50%;
    transform: translate(-100%, -50%);
    border: 8px solid transparent
}

.de-tooltip[data-position=left].active .de-tooltip-content, .de-tooltip[data-position=left]:hover:not(.de-tooltip-click) .de-tooltip-content, .de-tooltip[data-position=right].active .de-tooltip-content, .de-tooltip[data-position=right]:hover:not(.de-tooltip-click) .de-tooltip-content {
    transform: translate(12px, -50%)
}

.de-tooltip[data-position=right] .de-tooltip-content {
    left: 100%
}

.de-tooltip[data-position=right] .de-tooltip-content:before {
    left: 0;
    border-right: 10px solid var(--de-tooltipBg)
}

.de-tooltip[data-x-position=right] .de-tooltip-content {
    left: -.33334rem;
    transform: translateY(5px)
}

.de-tooltip[data-x-position=right] .de-tooltip-content:before {
    left: 1rem
}

.de-tooltip[data-x-position=right].active .de-tooltip-content, .de-tooltip[data-x-position=right]:hover:not(.de-tooltip-click) .de-tooltip-content {
    transform: translate(0)
}

.de-tooltip[data-position=left] .de-tooltip-content {
    right: 100%;
    left: auto;
    transform: translate(-20px, -50%)
}

.de-tooltip[data-position=left] .de-tooltip-content:before {
    left: calc(100% + 16px);
    border-left: 10px solid var(--de-tooltipBg)
}

.de-tooltip[data-position=left].active .de-tooltip-content, .de-tooltip[data-position=left]:hover:not(.de-tooltip-click) .de-tooltip-content {
    transform: translate(-12px, -50%)
}

.de-tooltip[data-y-position=top] .de-tooltip-content, .de-tooltip-y-top .de-tooltip-content {
    top: 0;
    transform: translate(-50%, -100%);
    margin-top: 0
}

.de-tooltip[data-y-position=top] .de-tooltip-content:before, .de-tooltip-y-top .de-tooltip-content:before {
    top: 100%;
    left: 50%;
    transform: translate(-50%);
    border: .4rem solid transparent;
    border-top: .4rem solid var(--de-tooltipBg)
}

.de-tooltip[data-y-position=top].active .de-tooltip-content, .de-tooltip[data-y-position=top]:hover:not(.de-tooltip-click) .de-tooltip-content, .de-tooltip-y-top.active .de-tooltip-content, .de-tooltip-y-top:hover:not(.de-tooltip-click) .de-tooltip-content {
    transform: translate(-50%, -100%);
    top: -10px
}

.de-tooltip-small .de-tooltip-content {
    padding: 8px
}

.de-tooltip-small .de-tooltip-content:before {
    border-width: 6px !important
}

.de-tooltip-right .de-tooltip-content {
    left: auto;
    right: -.5rem;
    transform: translateY(.5rem)
}

.de-tooltip-right .de-tooltip-content:before {
    right: .15rem;
    left: auto
}

.de-tooltip-right.active>.de-tooltip-content, .de-tooltip-right:hover:not(.de-tooltip-click)>.de-tooltip-content {
    transform: translate(0)
}

.de-tooltip-left>.de-tooltip-content {
    left: -1rem;
    transform: translateY(8px)
}

.de-tooltip-left>.de-tooltip-content:before {
    left: 1.6rem
}

.de-tooltip-left.active>.de-tooltip-content, .de-tooltip-left:hover:not(.de-tooltip-click)>.de-tooltip-content {
    transform: translate(0)
}

.de-tooltip-left>.de-tooltip-content {
    left: 0
}

@media (min-width: 576px) {
    .de-tooltip-mobW-x-right .de-tooltip-content {
        left: auto;
        right: -.5rem;
        transform: translateY(.5rem)
    }

    .de-tooltip-mobW-x-right .de-tooltip-content:before {
        right: .15rem;
        left: auto
    }

    .de-tooltip-mobW-x-right.active>.de-tooltip-content, .de-tooltip-mobW-x-right:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }

    .de-tooltip-mobW-x-left>.de-tooltip-content {
        left: -1rem;
        transform: translateY(8px)
    }

    .de-tooltip-mobW-x-left>.de-tooltip-content:before {
        left: 1.6rem
    }

    .de-tooltip-mobW-x-left.active>.de-tooltip-content, .de-tooltip-mobW-x-left:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }
}

@media (min-width: 768px) {
    .de-tooltip-md-x-right .de-tooltip-content {
        left: auto;
        right: -.5rem;
        transform: translateY(.5rem)
    }

    .de-tooltip-md-x-right .de-tooltip-content:before {
        right: .15rem;
        left: auto
    }

    .de-tooltip-md-x-right.active>.de-tooltip-content, .de-tooltip-md-x-right:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }

    .de-tooltip-md-x-left>.de-tooltip-content {
        left: -1rem;
        transform: translateY(8px)
    }

    .de-tooltip-md-x-left>.de-tooltip-content:before {
        left: 1.6rem
    }

    .de-tooltip-md-x-left.active>.de-tooltip-content, .de-tooltip-md-x-left:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }
}

@media (max-width: 1536px) {
    .de-tooltip-lg-right .de-tooltip-content {
        left: auto;
        right: -.5rem;
        transform: translateY(.5rem)
    }

    .de-tooltip-lg-right .de-tooltip-content:before {
        right: .15rem;
        left: auto
    }

    .de-tooltip-lg-right.active>.de-tooltip-content, .de-tooltip-lg-right:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }

    .de-tooltip-lg-left>.de-tooltip-content {
        left: -1rem;
        transform: translateY(8px)
    }

    .de-tooltip-lg-left>.de-tooltip-content:before {
        left: 1.6rem
    }

    .de-tooltip-lg-left.active>.de-tooltip-content, .de-tooltip-lg-left:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }
}

@media (max-width: 1119px) {
    .de-tooltip-md-right .de-tooltip-content, .de-tooltip-tablet-right .de-tooltip-content {
        left: auto;
        right: -.5rem;
        transform: translateY(.5rem)
    }

    .de-tooltip-md-right .de-tooltip-content:before, .de-tooltip-tablet-right .de-tooltip-content:before {
        right: .15rem;
        left: auto
    }

    .de-tooltip-md-right.active>.de-tooltip-content, .de-tooltip-md-right:hover:not(.de-tooltip-click)>.de-tooltip-content, .de-tooltip-tablet-right.active>.de-tooltip-content, .de-tooltip-tablet-right:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }

    .de-tooltip-md-left>.de-tooltip-content, .de-tooltip-tablet-left>.de-tooltip-content {
        left: -1rem;
        transform: translateY(8px)
    }

    .de-tooltip-md-left>.de-tooltip-content:before, .de-tooltip-tablet-left>.de-tooltip-content:before {
        left: 1.6rem
    }

    .de-tooltip-md-left.active>.de-tooltip-content, .de-tooltip-md-left:hover:not(.de-tooltip-click)>.de-tooltip-content, .de-tooltip-tablet-left.active>.de-tooltip-content, .de-tooltip-tablet-left:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }
}

@media (max-width: 768px) {
    .de-tooltip-mob-right .de-tooltip-content {
        left: auto;
        right: -.5rem;
        transform: translateY(.5rem)
    }

    .de-tooltip-mob-right .de-tooltip-content:before {
        right: .15rem;
        left: auto
    }

    .de-tooltip-mob-right.active>.de-tooltip-content, .de-tooltip-mob-right:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }

    .de-tooltip-mob-left>.de-tooltip-content {
        left: -1rem;
        transform: translateY(8px)
    }

    .de-tooltip-mob-left>.de-tooltip-content:before {
        left: 1.6rem
    }

    .de-tooltip-mob-left.active>.de-tooltip-content, .de-tooltip-mob-left:hover:not(.de-tooltip-click)>.de-tooltip-content {
        transform: translate(0)
    }
}

@media (min-width: 576px) {
    .de-tooltip-y-top-sm .de-tooltip-content {
        top: 0;
        transform: translate(-50%, -100%);
        margin-top: 0
    }

    .de-tooltip-y-top-sm .de-tooltip-content:before {
        top: 100%;
        left: 50%;
        transform: translate(-50%);
        border: .4rem solid transparent;
        border-top: .4rem solid var(--de-tooltipBg)
    }

    .de-tooltip-y-top-sm.active .de-tooltip-content, .de-tooltip-y-top-sm:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%, -100%);
        top: -10px
    }

    .de-tooltip-y-bottom-sm .de-tooltip-content {
        top: 100%;
        margin-top: 10px;
        transform: translate(-50%, 5px)
    }

    .de-tooltip-y-bottom-sm .de-tooltip-content:before {
        top: 0;
        border: .4rem solid transparent;
        border-bottom: .4rem solid var(--de-tooltipBg);
        bottom: initial;
        transform: translate(-50%, -100%)
    }

    .de-tooltip-y-bottom-sm.active .de-tooltip-content, .de-tooltip-y-bottom-sm:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%);
        top: 100%
    }
}

@media (min-width: 768px) {
    .de-tooltip-y-top-md .de-tooltip-content {
        top: 0;
        transform: translate(-50%, -100%);
        margin-top: 0
    }

    .de-tooltip-y-top-md .de-tooltip-content:before {
        top: 100%;
        left: 50%;
        transform: translate(-50%);
        border: .4rem solid transparent;
        border-top: .4rem solid var(--de-tooltipBg)
    }

    .de-tooltip-y-top-md.active .de-tooltip-content, .de-tooltip-y-top-md:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%, -100%);
        top: -10px
    }

    .de-tooltip-y-bottom-md .de-tooltip-content {
        top: 100%;
        margin-top: 10px;
        transform: translate(-50%, 5px)
    }

    .de-tooltip-y-bottom-md .de-tooltip-content:before {
        top: 0;
        border: .4rem solid transparent;
        border-bottom: .4rem solid var(--de-tooltipBg);
        bottom: initial;
        transform: translate(-50%, -100%)
    }

    .de-tooltip-y-bottom-md.active .de-tooltip-content, .de-tooltip-y-bottom-md:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%);
        top: 100%
    }
}

@media (min-width: 992px) {
    .de-tooltip-y-top-lg .de-tooltip-content {
        top: 0;
        transform: translate(-50%, -100%);
        margin-top: 0
    }

    .de-tooltip-y-top-lg .de-tooltip-content:before {
        top: 100%;
        left: 50%;
        transform: translate(-50%);
        border: .4rem solid transparent;
        border-top: .4rem solid var(--de-tooltipBg)
    }

    .de-tooltip-y-top-lg.active .de-tooltip-content, .de-tooltip-y-top-lg:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%, -100%);
        top: -10px
    }

    .de-tooltip-y-bottom-lg .de-tooltip-content {
        top: 100%;
        margin-top: 10px;
        transform: translate(-50%, 5px)
    }

    .de-tooltip-y-bottom-lg .de-tooltip-content:before {
        top: 0;
        border: .4rem solid transparent;
        border-bottom: .4rem solid var(--de-tooltipBg);
        bottom: initial;
        transform: translate(-50%, -100%)
    }

    .de-tooltip-y-bottom-lg.active .de-tooltip-content, .de-tooltip-y-bottom-lg:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%);
        top: 100%
    }
}

@media (min-width: 1200px) {
    .de-tooltip-y-top-xl .de-tooltip-content {
        top: 0;
        transform: translate(-50%, -100%);
        margin-top: 0
    }

    .de-tooltip-y-top-xl .de-tooltip-content:before {
        top: 100%;
        left: 50%;
        transform: translate(-50%);
        border: .4rem solid transparent;
        border-top: .4rem solid var(--de-tooltipBg)
    }

    .de-tooltip-y-top-xl.active .de-tooltip-content, .de-tooltip-y-top-xl:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%, -100%);
        top: -10px
    }

    .de-tooltip-y-bottom-xl .de-tooltip-content {
        top: 100%;
        margin-top: 10px;
        transform: translate(-50%, 5px)
    }

    .de-tooltip-y-bottom-xl .de-tooltip-content:before {
        top: 0;
        border: .4rem solid transparent;
        border-bottom: .4rem solid var(--de-tooltipBg);
        bottom: initial;
        transform: translate(-50%, -100%)
    }

    .de-tooltip-y-bottom-xl.active .de-tooltip-content, .de-tooltip-y-bottom-xl:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%);
        top: 100%
    }
}

@media (min-width: 1366px) {
    .de-tooltip-y-top-xxl .de-tooltip-content {
        top: 0;
        transform: translate(-50%, -100%);
        margin-top: 0
    }

    .de-tooltip-y-top-xxl .de-tooltip-content:before {
        top: 100%;
        left: 50%;
        transform: translate(-50%);
        border: .4rem solid transparent;
        border-top: .4rem solid var(--de-tooltipBg)
    }

    .de-tooltip-y-top-xxl.active .de-tooltip-content, .de-tooltip-y-top-xxl:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%, -100%);
        top: -10px
    }

    .de-tooltip-y-bottom-xxl .de-tooltip-content {
        top: 100%;
        margin-top: 10px;
        transform: translate(-50%, 5px)
    }

    .de-tooltip-y-bottom-xxl .de-tooltip-content:before {
        top: 0;
        border: .4rem solid transparent;
        border-bottom: .4rem solid var(--de-tooltipBg);
        bottom: initial;
        transform: translate(-50%, -100%)
    }

    .de-tooltip-y-bottom-xxl.active .de-tooltip-content, .de-tooltip-y-bottom-xxl:hover:not(.de-tooltip-click) .de-tooltip-content {
        transform: translate(-50%);
        top: 100%
    }
}

.de-tooltip-trigger {
    cursor: pointer;
    position: relative
}

.de-tooltip-trigger.tooltip-color-inherit {
    color: inherit
}

.de-tooltip-trigger.icon:not(.tooltip-color-inherit):hover {
    color: var(--de-iconColor)
}

.de-tooltip-content {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 5px);
    z-index: 100;
    transition: all .3s;
    margin-top: 12px;
    text-align: left;
    width: 230px;
    white-space: initial;
    box-shadow: 0 0 8px 1px #ffffff05
}

@media (min-width: 2560px) {
    .de-tooltip-content {
        width: 300px
    }
}

.de-tooltip-content a {
    color: var(--de-tooltipColor)
}

.de-tooltip-content__title {
    border-bottom: 1px solid var(--de-borderColor);
    padding-bottom: 16px;
    text-transform: uppercase
}

.de-tooltip-content__title+.de-tooltip-content__text {
    padding-top: 10px
}

.de-tooltip-content:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1rem;
    bottom: 100%;
    left: 0
}

.btn-sm+.de-tooltip-content {
    margin-top: 8px
}

.de-tooltip-table {
    border: none;
    width: 100%;
    border-spacing: 0
}

.de-tooltip-table td, .de-tooltip-table th {
    border: none;
    padding: 4px 0
}

.de-tooltip-table td:last-child {
    text-align: right
}

.de-tooltip-aligner {
    margin-left: 23px
}

.table-tooltip-content {
    margin-top: 0;
    cursor: auto;
    right: 0;
    left: auto !important;
    transform: translateY(5px)
}

@media (min-width: 1366px) {
    .table-tooltip-content {
        left: 0 !important;
        right: auto
    }
}

.table-tooltip-content:before {
    content: none
}

.d-inline .tooltip-icon {
    vertical-align: middle
}

table {
    color: var(--de-bodyColor);
    font-size: var(--de-bodyFontSize);
    line-height: 16px;
    width: 100%
}

table td, table th {
    vertical-align: top;
    text-align: left;
    padding: 15px
}

table td small, table th small {
    font-size: 10px;
    line-height: 13px;
    opacity: .5
}

table th {
    font-weight: 400
}

table.num-table td:first-child, table.num-table th:first-child {
    color: var(--de-muted-color)
}

table.light-style {
    border-collapse: separate;
    border-spacing: 0 1px
}

table.light-style tbody td {
    background: var(--table-td)
}

@media (max-width: 767.5px) {
    table.mobile-table {
        display: block;
        width: 100%
    }

    table.mobile-table thead {
        display: none
    }

    table.mobile-table tbody, table.mobile-table tr, table.mobile-table td, table.mobile-table th {
        display: block;
        width: 100%
    }

    table.mobile-table tr {
        margin-bottom: 20px
    }

    table.mobile-table td {
        position: relative;
        padding: 0 20px;
        display: flex;
        align-items: center
    }

    table.mobile-table td:before {
        content: attr(data-title);
        width: 130px;
        margin-right: auto;
        padding: 12px 0;
        color: var(--de-bodyColor)
    }
}

.table-box-head {
    display: flex;
    flex-wrap: wrap;
    padding: var(--de-gapLg) 0 var(--de-gapMd)
}

@media (min-width: 768px) {
    .table-box-head {
        align-items: center
    }
}

.table-box {
    overflow: hidden;
    width: 100%
}

.table-box__title {
    margin-bottom: var(--de-gapMd);
    width: 100%
}

@media (min-width: 768px) {
    .table-box__title {
        order: 1
    }
}

@media (min-width: 1200px) {
    .table-box__title {
        margin-bottom: 0;
        padding-right: 1rem;
        margin-right: auto;
        width: auto
    }
}

.table-box__search {
    flex: 1;
    margin-right: var(--de-gapXs)
}

@media (min-width: 768px) {
    .table-box__search {
        order: 3
    }
}

@media (min-width: 1200px) {
    .table-box__search {
        flex: 0 0 auto;
        width: 420px
    }
}

@media (min-width: 768px) {
    .table-box__refresh {
        order: 4
    }
}

.table-box__filter {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
    margin-top: var(--de-gapMd)
}

@media (min-width: 768px) {
    .table-box__filter {
        width: auto;
        margin-top: 0;
        order: 2;
        margin-right: var(--de-gapXs)
    }
}

.table-box__actions {
    margin-top: var(--de-gapSm);
    width: 100%
}

@media (min-width: 768px) {
    .table-box__actions {
        order: 4;
        margin-top: 0;
        margin-left: var(--de-gapSm);
        width: auto
    }
}

.table-box__not-found {
    padding: 20px;
    background: var(--theme-fontColor-10);
    margin-bottom: 2rem;
    min-height: 18rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase
}

@media (min-width: 768px) {
    .table-box__not-found {
        min-height: 22rem
    }
}

@media (min-width: 768px) and (max-width: 1199.5px) {
    .table-box__not-found {
        position: absolute;
        left: 0;
        right: 0
    }
}

.table-box-footer {
    padding: var(--de-gapMd) 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 8rem
}

.table-box-footer__center:first-child {
    margin-left: auto
}

.table-box-footer__right {
    width: 8rem;
    margin-left: auto;
    text-align: right
}

@media (max-width: 575.5px) {
    body .ngx-pagination .small-screen {
        display: flex;
        padding: 0
    }

    body .ngx-pagination .small-screen~li:not(.pagination-next) {
        display: none
    }
}

.pseudo-table {
    font-family: var(--de-fontFamilyMonospace)
}

.pseudo-table .de-tooltip-content {
    font-family: var(--de-fontFamily)
}

.pseudo-table__tr {
    display: flex;
    flex-wrap: wrap;
    color: var(--de-bodyColor);
    text-decoration: none;
    margin-bottom: 2rem;
    border: 1px solid var(--de-borderColor);
    border-radius: var(--de-borderRadius);
    position: relative
}

.pseudo-table__tr:last-child {
    margin-bottom: 0
}

@media (min-width: 768px) {
    .pseudo-table__tr {
        border: none;
        flex-wrap: nowrap;
        margin-bottom: var(--de-gapXs);
        align-items: center;
        width: 100%
    }
}

.pseudo-table__tr:hover {
    color: var(--de-bodyColor)
}

.pseudo-table__tr-link {
    position: absolute;
    inset: 0
}

.pseudo-table__th {
    font-size: var(--de-bodyFontSizeSm);
    color: var(--de-mutedColor)
}

.pseudo-table__td {
    display: flex;
    text-align: right
}

@media (min-width: 768px) {
    .pseudo-table__td {
        align-items: center;
        background: var(--table-td);
        min-height: 4rem
    }
}

.pseudo-table__td:before {
    content: attr(data-title);
    margin-right: auto;
    color: var(--de-mutedColor);
    text-align: left;
    font-size: var(--de-bodyFontSizeSm)
}

.pseudo-table__th, .pseudo-table__td {
    flex: 0 0 100%;
    padding: var(--de-gapMd)
}

.pseudo-table__th:not(:last-child), .pseudo-table__td:not(:last-child) {
    border-bottom: 1px solid var(--de-borderColor)
}

@media (min-width: 768px) {
    .pseudo-table__th:not(:last-child), .pseudo-table__td:not(:last-child) {
        border-bottom: none
    }
}

@media (min-width: 768px) {
    .pseudo-table__th, .pseudo-table__td {
        flex: 1 0 0
    }
}

.pseudo-table__thead {
    display: none
}

@media (min-width: 768px) {
    .pseudo-table__thead {
        display: flex
    }
}

@media (min-width: 768px) {
    .pseudo-table.active {
        background: var(--table-td-accent)
    }
}

@media (min-width: 768px) {
    .pseudo-table__tbody .pseudo-table__tr {
        background: var(--table-td);
        transition: background .3s;
        --mdc-checkbox-unselected-icon-color: var(--de-controlBgActive);
        --mdc-checkbox-unselected-focus-icon-color: var(--de-controlBgActive);
        --mdc-checkbox-unselected-hover-icon-color: var(--de-controlBgActive);
        --mdc-checkbox-unselected-hover-bg: var(--de-btnPrimaryBgDisabled)
    }

    .pseudo-table__tbody .pseudo-table__tr.active, .pseudo-table__tbody .pseudo-table__tr:hover {
        background: var(--table-td-accent)
    }

    .pseudo-table__tbody .pseudo-table__tr.active .btn-outline-secondary, .pseudo-table__tbody .pseudo-table__tr:hover .btn-outline-secondary {
        border-color: var(--de-btnSecondaryOutlineHover)
    }

    .pseudo-table__td {
        display: flex;
        padding: 14px 20px;
        margin-bottom: 0;
        background: none;
        text-align: left
    }

    .pseudo-table__td:before {
        content: none
    }
}

.pseudo-table p {
    margin-bottom: 0
}

@media (min-width: 768px) {
    .pseudo-table p {
        margin-bottom: 4px
    }

    .pseudo-table p:last-child {
        margin-bottom: 0
    }
}

.__table {
    width: 100%
}

.__table .__tr {
    display: flex;
    flex-wrap: nowrap;
    width: 100%
}

.__table .__td, .__table .__th {
    flex: 1 0 0;
    padding: 15px
}

.__table .mat-expansion-panel-header .mat-expansion-indicator {
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -8px;
    opacity: .3
}

.__table .mat-expansion-panel-header .mat-expansion-indicator:after {
    content: url("data:image/svg+xml,%3Csvg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.37418 -2.73555e-08C7.85646 -6.27447e-09 8.15694 0.502329 7.91394 0.902323L4.78976 5.70232C4.54863 6.09923 3.95137 6.09923 3.71024 5.70232L0.586063 0.902322C0.343057 0.502328 0.643545 -3.21561e-07 1.12582 -3.0048e-07L7.37418 -2.73555e-08Z' fill='white'/%3E%3C/svg%3E%0A");
    border: none;
    transform: none;
    padding: 0
}

.__table .mat-expansion-panel-header:hover .mat-expansion-indicator {
    opacity: 1
}

.__table .mat-expansion-panel-content {
    font-family: inherit;
    font-size: var(--de-bodyFontSize);
    line-height: 16px
}

.__table .mat-expansion-panel-body {
    padding: 0
}

.__table .mat-expansion-panel-spacing {
    margin: 0
}

.__table .mat-expansion-panel.mat-expanded .mat-expansion-indicator {
    opacity: 1
}

.table-footer {
    display: flex;
    align-items: center;
    padding: 16px 20px
}

.table-footer__pager {
    width: 100px;
    color: var(--de-mutedColor);
    font-size: var(--de-bodyFontSize)
}

.table-footer__loader {
    margin: 0 auto;
    padding-right: 100px
}

.table-footer__loader .btn {
    padding: 7px 10px
}

@media (max-width: 767.5px) {
    .light-mode .__transaction-table {
        border-spacing: 0 !important;
        border-collapse: collapse !important
    }

    .light-mode .__transaction-table th {
        border-right: 1px solid rgba(215, 215, 215, .3)
    }

    .light-mode .__transaction-table tr:not(:last-child) td, .light-mode .__transaction-table tr:not(:last-child) th {
        border-top: 1px solid rgba(215, 215, 215, .3)
    }
}

.amount-table__tr {
    display: flex;
    align-items: center;
    text-align: left
}

.amount-table__tr span {
    display: inline-block
}

.amount-table__tr span:first-child {
    flex: 0 0 5rem;
    width: 5rem
}

@media (min-width: 1366px) {
    .show-all-orders .__transaction-table .__time-col {
        flex: 0 0 calc(18% - 3rem);
        max-width: calc(18% - 3rem)
    }

    .show-all-orders .__transaction-table .__assets-col-from {
        max-width: 25%
    }

    .show-all-orders .__transaction-table .__price-col {
        flex: 0 0 19%;
        max-width: 19%;
        margin-right: 0
    }

    .show-all-orders .__transaction-table .__assets-awaiting {
        flex: 0 0 calc(83% - 3rem);
        max-width: calc(83% - 3rem)
    }

    .show-all-orders .__transaction-table .__status-col {
        flex: 0 0 17%;
        max-width: 17%
    }
}

@media (min-width: 1600px) {
    .show-all-orders .__transaction-table .__assets-col-from {
        max-width: 20%
    }

    .show-all-orders .__transaction-table .__status-col {
        flex: 0 0 23%;
        max-width: 23%
    }

    .show-all-orders .__transaction-table .__assets-awaiting {
        flex: 0 0 calc(77% - 3rem);
        max-width: calc(77% - 3rem)
    }
}

.num-col {
    color: var(--de-mutedColor);
    font-size: var(--de-bodyFontSizeSm)
}

@media (min-width: 768px) {
    .num-col {
        flex: 0 0 3rem;
        max-width: 3rem;
        padding-right: 0
    }

    .num-col-large {
        flex: 0 0 6rem;
        max-width: 6rem
    }
}

.fee-sum__plus {
    color: var(--de-mutedColor)
}

.table-loading {
    margin: auto
}

.table-not-found {
    flex: 1;
    padding: var(--de-gapMd);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-family: var(--de-fontFamily);
    margin: auto
}

.latest-orders .pseudo-table__tr:nth-last-child(-n+4):not(:nth-child(-n+4)) .__give-token-tooltip {
    top: initial;
    bottom: 100%
}

.latest-orders .__token-take {
    flex-wrap: wrap;
    justify-content: flex-end;
    padding: .3rem 0
}

@media (min-width: 768px) {
    .latest-orders .__token-take {
        padding: 0;
        justify-content: flex-start
    }
}

.latest-orders .__token-take__chain {
    flex: 0 0 2rem
}

.latest-orders .__token-take__amount {
    flex: 0 0 auto;
    max-width: calc(100% - 3rem)
}

@media (min-width: 1200px) {
    .latest-orders .__token-take__amount {
        margin-right: 1rem
    }
}

.latest-orders .__take-surplus {
    background: var(--de-btnSecondaryBg);
    border-radius: 5px;
    padding: .5rem;
    font-size: 10px
}

.latest-orders .__take-surplus__tooltip {
    width: 24rem;
    font-size: var(--de-bodyFontSize);
    font-weight: 300
}

@media (min-width: 768px) {
    .latest-orders .__time-col {
        flex: 0 0 calc(19% - 3rem);
        max-width: calc(19% - 3rem);
        padding-right: 0
    }

    .latest-orders .__price-col {
        flex: 0 0 18%;
        max-width: 18%
    }

    .latest-orders .__assets-col {
        flex: 1;
        max-width: 21%;
        padding-right: 0
    }

    .latest-orders .__status-col {
        flex: 0 0 24%;
        max-width: 24%
    }
}

@media (min-width: 992px) {
    .latest-orders .__time-col {
        flex: 0 0 calc(15% - 3rem);
        max-width: calc(15% - 3rem)
    }

    .latest-orders .__price-col {
        flex: 0 0 16%;
        max-width: 16%
    }

    .latest-orders .__status-col {
        flex: 0 0 26%;
        max-width: 26%
    }

    .latest-orders .__assets-col {
        max-width: 23%
    }
}

@media (min-width: 1366px) {
    .latest-orders .__time-col {
        flex: 0 0 calc(19% - 3rem);
        max-width: calc(19% - 3rem)
    }

    .latest-orders .__assets-col {
        flex: 1;
        max-width: 21%
    }

    .latest-orders .__price-col {
        flex: 0 0 20%;
        max-width: 20%
    }

    .latest-orders .__status-col {
        flex: 0 0 22%;
        max-width: 22%
    }
}

@media (min-width: 1600px) {
    .latest-orders .__time-col {
        flex: 0 0 calc(21% - 3rem);
        max-width: calc(21% - 3rem)
    }

    .latest-orders .__assets-col {
        flex: 1;
        max-width: 20%
    }

    .latest-orders .__price-col {
        flex: 0 0 17%;
        max-width: 17%
    }

    .latest-orders .__status-col {
        flex: 0 0 24%;
        max-width: 24%
    }
}

@media (min-width: 1200px) {
    .latest-orders-full .table-box-head {
        padding-right: 8rem
    }
}

.step-nav {
    display: flex;
    justify-content: space-between;
    position: relative
}

.step-nav.step-nav-wide .step-nav-progress {
    flex: .6
}

@media (max-width: 575.5px) {
    .step-nav.step-nav-wide {
        flex-wrap: wrap
    }

    .step-nav.step-nav-wide .step-nav-item {
        flex: 0 0 40%
    }

    .step-nav.step-nav-wide .step-nav-progress {
        flex: 0 0 20%
    }

    .step-nav.step-nav-wide .step-nav-progress:nth-child(4n+4) {
        flex: 0 0 61%;
        margin: 2.5rem auto
    }

    .step-nav.step-nav-wide .step-nav-progress:nth-child(4n+4):before, .step-nav.step-nav-wide .step-nav-progress:nth-child(4n+4):after {
        content: "";
        height: 1.5rem;
        width: 1px;
        background: var(--de-borderColor);
        position: absolute
    }

    .step-nav.step-nav-wide .step-nav-progress:nth-child(4n+4):before {
        right: 0;
        bottom: 0
    }
}

.step-nav-progress {
    flex: 1;
    height: 1px;
    background: var(--de-borderColor);
    margin-top: 20px;
    position: relative
}

.step-nav-item {
    display: block;
    flex: 1;
    text-align: center;
    position: relative
}

.step-nav-item__num {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 4rem;
    height: 4rem;
    line-height: 1;
    text-align: center;
    border: 1px solid var(--de-borderColor);
    border-radius: 100%;
    color: var(--de-bodyColor);
    background: var(--de-controlBg)
}

.step-nav-item__num:before {
    content: "";
    position: absolute;
    right: -.2rem;
    top: -.2rem;
    background: var(--de-dropdownBg);
    border-radius: 100%;
    width: 1.6667rem;
    height: 1.6667rem
}

.step-nav-item__num:after {
    content: "\e918";
    font-family: icomoon;
    color: var(--de-success);
    position: absolute;
    right: 0;
    top: 0
}

.step-nav-item__text {
    line-height: 1.2;
    color: var(--de-mutedColor);
    font-weight: 400
}

.step-nav-item.active .step-nav-item__num {
    background: var(--de-controlBg);
    border: var(--de-borderWidth) solid var(--de-borderColor);
    z-index: 1
}

.step-nav-item.active .step-nav-item__num:after {
    content: none
}

.step-nav-item.active .step-nav-item__num:before {
    content: "";
    position: absolute;
    inset: -1px;
    width: auto;
    height: auto;
    background-image: url(step-loader.635f99364ed4c300.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
    animation: rotate 1.5s infinite linear
}

.step-nav-item.active~.step-nav-item .step-nav-item__num {
    background: none
}

.step-nav-item.active~.step-nav-item .step-nav-item__num:after, .step-nav-item.active~.step-nav-item .step-nav-item__num:before {
    content: none
}

.line-stepper {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.line-stepper__arrow {
    color: var(--de-mutedColor);
    border-bottom: 1px solid;
    opacity: .3;
    display: block;
    flex: 1;
    margin: 0 1rem;
    position: relative
}

.line-stepper__arrow:after {
    content: "\e912";
    font-family: icomoon;
    position: absolute;
    right: 0;
    top: -6px;
    font-size: 10px
}

.line-stepper li {
    color: var(--de-mutedColor);
    opacity: .3;
    text-align: center
}

.line-stepper li.active {
    opacity: 1;
    color: var(--de-bodyColor)
}

.step-item:not(:last-child) {
    border-bottom: 1px solid var(--de-borderColor);
    margin-bottom: 2rem;
    padding-bottom: 2rem
}

.step-item__number {
    width: 38px;
    float: left
}

.step-item__number span {
    display: block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    background: var(--badge-bg);
    color: var(--de-bodyColor);
    text-align: center;
    font-size: var(--de-bodyFontSize);
    border-radius: 100%
}

@media (min-width: 2560px) {
    .step-item__number span {
        width: 32px;
        height: 32px;
        line-height: 32px
    }
}

.step-item__content {
    width: 100%
}

.step-item-title {
    font-size: var(--text-size-lg);
    line-height: 20px;
    text-transform: uppercase;
    margin-bottom: 2rem
}

@media (min-width: 768px) {
    .step-item {
        display: flex
    }

    .step-item__number {
        flex: 0 0 38px;
        float: none
    }

    .step-item__content {
        flex: 0 0 calc(100% - 38px);
        width: calc(100% - 38px)
    }
}

@media (min-width: 2560px) {
    .step-item__number {
        width: 50px;
        flex: 0 0 50px
    }

    .step-item__content {
        flex: 0 0 calc(100% - 50px);
        width: calc(100% - 50px)
    }
}

body .mat-expansion-panel {
    background: none;
    box-shadow: none !important
}

body .mat-expansion-indicator {
    color: var(--de-mutedColor)
}

body .mat-expansion-indicator:after {
    border-width: 0 1px 1px 0
}

.clear-accordion .mat-expansion-panel {
    border-radius: 0 !important;
    background: none;
    margin-bottom: 12px;
    box-shadow: none !important
}

@media (min-width: 768px) {
    .clear-accordion .mat-expansion-panel {
        margin-bottom: 0
    }
}

.clear-accordion .mat-expansion-panel-header {
    height: auto;
    padding: 0;
    background: none !important
}

.clear-accordion .mat-expansion-panel-header .mat-content {
    overflow: visible;
    align-items: center;
    flex-wrap: wrap
}

.clear-accordion .mat-expansion-panel-body {
    padding: 0
}

.clear-accordion .mat-expansion-panel-spacing {
    margin: 0 0 12px
}

@media (min-width: 768px) {
    .clear-accordion .mat-expansion-panel-spacing {
        margin: 0
    }
}

.explorer-accordion.mat-accordion .mat-expansion-panel {
    border: 1px solid var(--de-borderColor);
    border-radius: 10px !important
}

@media (min-width: 768px) {
    .explorer-accordion.mat-accordion .mat-expansion-panel {
        border-radius: 20px !important
    }
}

.explorer-accordion.mat-accordion .mat-expansion-panel-header {
    padding: var(--exp-tab-space);
    font-size: var(--text-size-lg);
    text-transform: uppercase
}

.explorer-accordion.mat-accordion .mat-expansion-panel-body {
    padding: 0
}

.infobox-group {
    display: flex;
    flex-wrap: wrap
}

.infobox-item {
    display: flex;
    flex-direction: column;
    padding: var(--de-cardPadding);
    flex: 0 0 100%
}

.infobox-item__title {
    font-size: var(--de-h2FontSize);
    margin-bottom: .3rem
}

.infobox-item__content {
    font-size: var(--de-h2FontSize);
    color: var(--de-mutedColor)
}

.nav-tab {
    display: flex;
    align-items: center;
    max-width: 100%;
    overflow-x: auto;
    border-bottom: var(--de-borderWidth) solid var(--de-borderColor)
}

.nav-tab .nav-tab-item {
    position: relative;
    padding: 0 0 2.6667rem;
    font-size: var(--de-bodyFontSizeLg);
    transition: color .3s;
    white-space: nowrap
}

.nav-tab .nav-tab-item+.nav-tab-item {
    margin-left: 2rem
}

@media (min-width: 768px) {
    .nav-tab .nav-tab-item+.nav-tab-item {
        margin-left: 3rem
    }
}

.nav-tab .nav-tab-item:hover:not(.active) {
    color: var(--de-primary)
}

.nav-tab .nav-tab-item.active {
    color: var(--de-primary)
}

.nav-tab .nav-tab-item.active:after {
    height: 4px
}

.nav-tab .nav-tab-item:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0;
    border-radius: var(--de-borderRadius) var(--de-borderRadius) 0 0;
    background: var(--de-primary);
    transition: height .2s
}

.mat-mdc-tab-group .mat-mdc-tab-body-wrapper {
    overflow: visible
}

.mat-mdc-tab-group .mat-mdc-tab.mdc-tab {
    height: auto
}

.mat-mdc-tab-group .mdc-tab-indicator__content {
    height: 4px;
    border: none;
    border-radius: var(--de-borderRadius) var(--de-borderRadius) 0 0;
    background: var(--de-primary)
}

.mat-mdc-tab-group .mdc-tab {
    height: auto;
    min-width: initial;
    box-shadow: none;
    padding: 1rem 0;
    color: var(--de-mutedColor);
    text-transform: none;
    font-weight: 400;
    font-size: var(--de-bodyFontSize);
    line-height: 1.3334rem;
    transition: background .2s;
    background: none
}

.mat-mdc-tab-group .mdc-tab--active {
    box-shadow: none;
    font-weight: 400;
    transition: background .2s
}

.mat-mdc-tab-group .mdc-tab+.mat-tab-label {
    margin-left: .8rem
}

.mat-mdc-tab-group .mat-mdc-tab-list {
    max-width: 100%;
    overflow-y: auto
}

.mat-mdc-tab-group .mat-mdc-tab-list::-webkit-scrollbar {
    display: none
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-list {
    max-width: initial;
    overflow: initial
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination {
    min-width: initial;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron {
    border-color: var(--de-mutedColor)
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination.mat-mdc-tab-header-pagination-before {
    left: 0;
    padding: 0 3rem 0 var(--de-gapMd);
    background: linear-gradient(90deg, var(--de-tabBgHover) 50%, transparent 100%)
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination.mat-mdc-tab-header-pagination-after {
    right: 0;
    padding: 0 var(--de-gapMd) 0 3rem;
    background: linear-gradient(-90deg, var(--de-tabBgHover) 50%, transparent 100%)
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination-disabled {
    display: none !important
}

.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination-disabled .mat-mdc-tab-header-pagination-chevron {
    opacity: 0
}

.tab-inline .mdc-tab, .tab-underline .mdc-tab {
    padding: 0 0 2.6667rem;
    font-size: var(--de-bodyFontSizeLg)
}

.tab-inline .mdc-tab:hover:not(.mdc-tab--active), .tab-underline .mdc-tab:hover:not(.mdc-tab--active) {
    color: var(--de-primary)
}

.tab-inline .mdc-tab--active, .tab-underline .mdc-tab--active {
    background: none;
    color: var(--de-primary)
}

.tab-inline .mdc-tab+.mdc-tab, .tab-underline .mdc-tab+.mdc-tab {
    margin-left: 2rem
}

@media (min-width: 768px) {
    .tab-inline .mdc-tab+.mdc-tab, .tab-underline .mdc-tab+.mdc-tab {
        margin-left: 3rem
    }
}

.tab-underline .mat-mdc-tab-header {
    border-bottom: var(--de-borderWidth) solid var(--de-borderColor)
}

.tab-btn .mdc-tab-indicator, .tab-btn-outline .mdc-tab-indicator {
    display: none
}

.tab-btn .mdc-tab, .tab-btn-outline .mdc-tab {
    padding: calc(1rem + var(--de-borderWidth)) 2rem;
    font-size: var(--de-bodyFontSize);
    background: var(--de-bodyBg)
}

.tab-btn .mdc-tab:hover:not(.mdc-tab--active), .tab-btn-outline .mdc-tab:hover:not(.mdc-tab--active) {
    color: var(--de-bodyColor);
    background: var(--de-tabBgHover)
}

.tab-btn .mdc-tab--active, .tab-btn-outline .mdc-tab--active {
    background: var(--de-tabBgActive);
    color: var(--de-bodyColor)
}

.tab-btn .mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination, .tab-btn-outline .mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination {
    top: 1px;
    bottom: 1px
}

.tab-btn .mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination.mat-mdc-tab-header-pagination-before, .tab-btn-outline .mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination.mat-mdc-tab-header-pagination-before {
    left: 1px;
    border-radius: var(--de-borderRadiusSm) 0 0 var(--de-borderRadiusSm)
}

.tab-btn .mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination.mat-mdc-tab-header-pagination-after, .tab-btn-outline .mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination.mat-mdc-tab-header-pagination-after {
    right: 1px;
    border-radius: 0 var(--de-borderRadiusSm) var(--de-borderRadiusSm) 0
}

.tab-btn-outline .mat-mdc-tab-label-container {
    border: var(--de-borderWidth) solid var(--de-borderColor);
    border-radius: var(--de-borderRadiusSm)
}

.tab-btn-outline .mdc-tab {
    padding: 6px 2rem;
    min-height: var(--de-btnSizeMd)
}

.visible-tabs, .visible-tabs .mat-mdc-tab-body.mat-mdc-tab-body-active, .visible-tabs .mat-mdc-tab-body-content, .visible-tabs .mat-mdc-tab-body-wrapper {
    overflow: visible
}

.container-fluid-tabs .mat-mdc-tab-body-wrapper, .container-fluid-tabs .mat-mdc-tab-header {
    padding: 0 calc(var(--bs-gutter-x) * .5)
}

.tab-counter {
    margin-left: .5rem;
    background: var(--de-controlBg);
    border-radius: 100%;
    padding: 2px;
    min-width: 18px;
    line-height: 14px;
    font-size: 10px;
    color: var(--de-bodyColor);
    font-weight: 400
}

.light-mode .tab-counter {
    background: #FFFFFF
}

.tab-justified .mat-mdc-tab.mdc-tab {
    flex: 1
}

.card {
    background: var(--de-cardBg);
    border-radius: var(--de-borderRadius);
    border: var(--de-borderWidth) solid var(--de-borderColor)
}

.card .preloader-above {
    border-radius: inherit
}

.card-section {
    padding: var(--de-cardPadding)
}

.card-section+.card-section {
    border-top: var(--de-borderWidth) solid var(--de-borderColor)
}

.card-header, .card-content, .card-footer {
    padding: var(--de-cardPadding)
}

.card-header:not(:last-child), .card-content:not(:last-child), .card-footer:not(:last-child) {
    border-bottom: var(--de-borderWidth) solid var(--de-borderColor)
}

.form-card {
    width: 100%;
    max-width: 100%;
    position: relative
}

@media (min-width: 768px) {
    .form-card {
        width: var(--de-modalWidth);
        background: var(--de-bodyBg);
        border-radius: var(--de-borderRadiusXl);
        margin-left: auto;
        margin-right: auto
    }

    .form-card .preloader-above {
        border-radius: var(--de-borderRadiusXl)
    }
}

.form-card__header {
    display: flex;
    align-items: center;
    padding: var(--card-padding)
}

.form-card__content, .form-card__footer {
    padding: var(--card-padding)
}

.form-card.form-card-steps .form-card__header {
    position: relative;
    padding-left: 6rem;
    padding-right: 6rem;
    justify-content: center
}

.form-card.form-card-steps .form-card__header .prev-step, .form-card.form-card-steps .form-card__header .next-step {
    position: absolute
}

.form-card.form-card-steps .form-card__header .prev-step {
    left: var(--card-padding)
}

.form-card.form-card-steps .form-card__header .next-step {
    right: var(--card-padding)
}

.form-card-title {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    font-family: GolosTextWebDemiBold, sans-serif;
    position: relative
}

.form-card-title i {
    font-style: inherit;
    color: var(--theme-fontColorAccent)
}

.form-card-title .powered-title, .form-card-title .powered-by {
    white-space: nowrap;
    font-size: 6px;
    font-family: Onest, sans-serif;
    font-weight: 400;
    color: #596076;
    display: flex;
    align-items: center
}

@media (min-width: 300px) {
    .form-card-title .powered-title, .form-card-title .powered-by {
        font-size: 8px
    }
}

.form-card-title .powered-title img, .form-card-title .powered-by img {
    display: block;
    max-height: 10px;
    transition: all .2s
}

.form-card-title .powered-title .icomoon-bridge, .form-card-title .powered-by .icomoon-bridge {
    font-size: 7px
}

@media (min-width: 768px) {
    .form-card-title .powered-title a:hover img, .form-card-title .powered-by a:hover img {
        filter: brightness(1.5)
    }
}

.form-card-title .powered-by {
    position: absolute;
    bottom: -10px;
    left: 0
}

.form-card-title .powered-by .icon {
    margin: 0 2px;
    font-size: 12px
}

.form-card-title .powered-title {
    font-size: 12px
}

.form-card-title .powered-title .icomoon-bridge {
    font-size: 75%
}

@media (min-width: 300px) {
    .form-card-title .powered-title {
        font-size: 14px
    }
}

.form-card-title a {
    color: inherit
}

.form-card-title__img {
    max-height: 50px;
    max-width: 100px;
    object-fit: contain
}

@media (min-width: 300px) {
    .form-card-title__img {
        max-width: 150px
    }
}

.card-box-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

@media (min-width: 768px) {
    .card-box-row {
        --bs-gutter-x: 2.6667rem
    }
}

@media (min-width: 768px) {
    .card-box-row .card-box-col {
        max-width: 50%;
        flex: 0 0 28rem
    }
}

.card-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative
}

@media (max-width: 575.5px) {
    .card-box {
        --aspect-ratio: 70%
    }
}

.card-box .card-box-bg {
    opacity: .7;
    transition: opacity .3s
}

.card-box:hover .card-box-bg {
    opacity: .9
}

.card-box .ratio-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem
}

.card-box__icon {
    margin-bottom: 1rem
}

.card-box__icon .icon {
    font-size: 3rem
}

@media (min-width: 768px) {
    .card-box__icon .icon {
        font-size: 3.33334rem
    }
}

.card-box__title {
    font-size: var(--text-size-lg)
}

.card-box__info {
    position: absolute;
    bottom: 1rem
}

.card-box .card-box-bg {
    border-radius: 2rem
}

.card-table__row {
    padding: 1rem 0;
    display: flex;
    align-items: center
}

.card-table__row:not(:last-child) {
    border-bottom: 1px solid var(--de-borderColor)
}

.card-table__th, .card-table__td {
    padding: .292rem 0;
    width: 60%
}

@media (min-width: 768px) {
    .card-table__th, .card-table__td {
        width: 76%
    }
}

.card-table__th {
    width: 40%;
    padding-right: 1rem;
    text-transform: uppercase;
    color: var(--de-mutedColor)
}

@media (min-width: 768px) {
    .card-table__th {
        width: 24%
    }
}

.card-table a.link {
    text-decoration: none;
    display: inline-block;
    border-bottom: 1px solid var(--de-borderColor)
}

.card-table .nft-image {
    border-radius: 4px;
    width: 4rem;
    height: 4rem
}

.dropdown-button {
    cursor: pointer
}

.dropdown-button:after {
    font-family: icomoon;
    content: "\e928";
    color: var(--de-mutedColor)
}

.dropdown-button:after, .dropdown-button .filter-reset {
    margin-left: 1rem;
    font-size: 12px;
    line-height: 12px
}

.dropdown-button.filtered:after {
    content: none !important
}

.dropdown-button:not(.filtered) .btn-indicator, .dropdown-button:not(.filtered) .filter-reset {
    display: none
}

.dropdown-box {
    position: relative
}

.dropdown-box__content {
    --button-toggle-checked-bg: var(--de-btnSecondaryBg);
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: var(--de-dropdownBg);
    color: var(--de-bodyColor);
    border-radius: var(--de-borderRadiusSm);
    border: 1px solid var(--de-borderColor);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: transform .2s ease-out, visibility .1s ease-out, opacity .2s;
    z-index: 900
}

.dropdown-box__content:before {
    content: "";
    position: absolute;
    top: -1rem;
    left: 0;
    height: 1rem;
    width: 100%
}

.dropdown-box__content.active-on-hover:not(.active):not(:hover) {
    pointer-events: none
}

.dropdown-box.dropdown-box-hover:hover .dropdown-box__content, .dropdown-box.active .dropdown-box__content {
    pointer-events: initial;
    opacity: 1;
    visibility: visible;
    transform: translateY(.5rem)
}

.dropdown-box.dropdown-box-hover:hover .dropdown-button:after, .dropdown-box.active .dropdown-button:after {
    content: "\e927"
}

.nft-image {
    position: relative;
    background: var(--image-placeholder-30);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    z-index: 1
}

.nft-image img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.nft-image .ratio-placeholder {
    object-fit: cover !important
}

.nft-image-play {
    z-index: 1
}

@media (min-width: 768px) {
    .nft-image-play {
        width: 5rem;
        height: 5rem
    }
}

.nft-image-format {
    position: absolute;
    right: 0;
    top: 0;
    background: var(--contrast-bg);
    border-radius: 0 4px;
    text-transform: uppercase;
    padding: .042rem .25rem
}

.nft-image.size-md {
    width: 10rem;
    height: 10rem
}

.nft-image.size-sm {
    width: 6.83rem;
    height: 6.83rem
}

.nft-image.size-xs {
    width: 3.66rem;
    height: 3.66rem
}

.gallery-card {
    text-decoration: none;
    position: relative;
    z-index: 1;
    display: block
}

.gallery-card:hover:before {
    inset: -1.3334rem -1.3334rem -1rem;
    opacity: .4;
    visibility: visible
}

.gallery-card:before {
    content: "";
    display: block;
    background: var(--card-accent);
    border-radius: 8px;
    inset: 0;
    position: absolute;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    transition: all .3s
}

.gallery-card__title {
    text-transform: uppercase;
    color: var(--de-primary);
    font-size: var(--text-size-lg);
    margin-bottom: 1rem
}

.gallery-card__title a {
    color: inherit;
    text-decoration: none
}

.gallery-card__link {
    display: block;
    text-decoration: none;
    position: relative;
    width: 100%;
    z-index: 1
}

.gallery-card__image {
    position: relative;
    z-index: 1;
    overflow: hidden;
    border-radius: 8px;
    background: var(--image-placeholder-30)
}

.gallery-card__image:before {
    display: block;
    padding-top: 100%;
    content: ""
}

.gallery-card__image img {
    display: block;
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.gallery-card__image .nft-image-format {
    padding: .2rem .5rem
}

.gallery-card__content {
    padding: 1.2rem 0 0
}

.gallery-card__plus {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6rem;
    height: 6rem
}

.gallery-card__plus:after, .gallery-card__plus:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--theme-fontColorAccent)
}

.gallery-card__plus:after {
    width: 6rem;
    height: .1rem
}

.gallery-card__plus:before {
    height: 6rem;
    width: .1rem
}

.gallery-card .gallery-items-count, .gallery-card .is-crosschain, .gallery-card .hover-tooltip {
    position: absolute;
    background: var(--de-bodyBg);
    line-height: 1;
    padding: .6667rem;
    min-width: 2.5rem;
    text-align: center;
    border-radius: var(--de-borderRadiusSm);
    z-index: 1
}

.gallery-card .gallery-items-count .gray, .gallery-card .is-crosschain .gray, .gallery-card .hover-tooltip .gray {
    background: var(--de-bodyBg)
}

.gallery-card .hover-tooltip {
    display: inline-flex;
    align-items: center;
    left: .6667rem;
    bottom: .6667rem
}

.gallery-card .hover-tooltip span {
    display: inline-block;
    max-width: 0;
    height: 1rem;
    overflow: hidden;
    transition: all .3s;
    opacity: 0;
    visibility: hidden
}

.gallery-card:hover .hover-tooltip span {
    opacity: 1;
    visibility: visible;
    max-width: 300px;
    margin-left: .6rem
}

.gallery-card .is-crosschain {
    top: .6667rem;
    right: .6667rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 1.4
}

.gallery-card .gallery-items-count {
    background: rgba(255, 255, 255, .7);
    color: #0d091a;
    top: .6667rem;
    left: .6667rem;
    padding: .75rem .689rem;
    box-shadow: 0 0 5px #00000040
}

@media (min-width: 768px) {
    .card.hover-animation:hover .card-image img, a.card:hover .card-image img {
        transform: scale(1.1)
    }
}

.gallery-grid {
    display: flex;
    flex-wrap: wrap
}

.gallery-grid .gallery-card {
    flex: 0 0 calc(50% - 1.3334rem);
    width: calc(50% - 1.3334rem);
    margin-right: 2.6667rem;
    margin-bottom: 2rem
}

.gallery-grid .gallery-card:nth-child(even) {
    margin-right: 0
}

@media (min-width: 992px) {
    .gallery-grid.per-row-4 .gallery-card {
        flex: 0 0 calc(33.33% - 1.8rem);
        width: calc(33.33% - 1.8rem);
        margin-right: 2.6667rem
    }

    .gallery-grid.per-row-4 .gallery-card:nth-child(even) {
        margin-right: 2.6667rem
    }

    .gallery-grid.per-row-4 .gallery-card:nth-child(3n+3) {
        margin-right: 0
    }
}

@media (min-width: 1200px) {
    .gallery-grid.per-row-4 .gallery-card {
        flex: 0 0 calc(25% - 2rem);
        width: calc(25% - 2rem)
    }

    .gallery-grid.per-row-4 .gallery-card:nth-child(3n+3) {
        margin-right: 2.6667rem
    }

    .gallery-grid.per-row-4 .gallery-card:nth-child(4n+4) {
        margin-right: 0
    }
}

.collections-grid .gallery-card__image {
    background: var(--image-placeholder)
}

.collections-grid .gallery-card__content {
    padding-top: 1.6rem
}

.collections-grid .collection-mask {
    position: absolute;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    bottom: -4px;
    left: 2px;
    border-radius: 0 0 8px 8px;
    background: linear-gradient(104.11deg, #0543D6 9.79%, #00C236 105.58%);
    opacity: .7;
    z-index: -1
}

.collections-grid .collection-mask:before {
    content: "";
    position: absolute;
    background: inherit;
    opacity: .5;
    border-radius: inherit;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    bottom: -4px;
    left: 4px
}

.collections-grid .gallery-card:nth-child(4n+3) .collection-mask {
    background: linear-gradient(147.91deg, #12163B 19.27%, #5D2169 58.14%, #CC2B4A 88.38%)
}

.card-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: .5rem 0
}

.card-info:not(:last-child) {
    border-bottom: 1px solid var(--contrast-bg-20)
}

.card-info__title {
    color: var(--de-mutedColor)
}

.card-info__value a {
    color: var(--de-bodyColor);
    text-decoration: none;
    transition: color .3s
}

.card-info__value a:hover {
    color: var(--de-bodyColor-80)
}

.items-not-found {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: var(--de-controlBg);
    padding: 2rem;
    border-radius: 1rem
}

.items-not-found .icon {
    margin-bottom: 1rem;
    font-size: 2rem
}

.nft-filter {
    margin-bottom: 2.6667rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.nft-filter__search {
    flex: 0 0 100%;
    width: 100%;
    margin: 0 0 1rem
}

@media (min-width: 1200px) {
    .nft-filter__search {
        width: auto;
        flex: 1;
        margin: 0 1.3334rem 0 0
    }
}

.nft-filter__search .form-control {
    padding: .7247rem 3rem .7247rem 1rem;
    font-size: var(--text-size-lg);
    border-radius: var(--de-borderRadiusSm)
}

.nft-filter__collection, .nft-filter__network {
    flex: 0 0 calc(50% - .5rem);
    width: calc(50% - .5rem)
}

@media (min-width: 768px) {
    .nft-filter__collection, .nft-filter__network {
        flex: 1;
        width: auto
    }
}

@media (min-width: 1200px) {
    .nft-filter__collection, .nft-filter__network {
        flex: 0 0 auto
    }
}

.nft-filter__collection .dropdown-button, .nft-filter__network .dropdown-button {
    width: 100%
}

.nft-filter__network {
    margin-right: 1rem
}

.nft-filter__collection {
    width: 14rem
}

@media (min-width: 768px) {
    .nft-filter__collection:not(:last-child) {
        margin-right: 1rem
    }
}

.nft-filter__native {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 1rem
}

@media (min-width: 768px) {
    .nft-filter__native {
        flex: 0 0 auto;
        width: auto;
        margin-top: 0
    }
}

@media (min-width: 1200px) {
    .nft-filter__native {
        margin-top: 0;
        flex: 0 0 auto;
        width: auto
    }
}

.img-loading {
    visibility: hidden !important
}

.img-loading+.ratio-placeholder {
    display: none !important
}

.file-loader {
    border: 1px dashed var(--de-borderColor);
    border-radius: var(--de-borderRadius);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: url(upload-bg.4049e2d6cbf07ca5.svg);
    background-size: cover;
    padding: 2rem;
    min-height: 10rem
}

.file-loader__text {
    text-align: center
}

.file-loader__formats {
    margin-top: .2rem;
    color: var(--de-mutedColor);
    text-transform: uppercase
}

.file-loader__button {
    margin-top: 1.2rem;
    text-transform: uppercase
}

.file-loader__button input {
    display: none
}

.file-loader__process {
    width: 100%;
    text-align: center
}

.file-loader-bar {
    position: relative
}

.file-loader-bar__percent {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-weight: 500
}

.file-loader-bar .mat-progress-bar {
    height: 1.42rem;
    border-radius: 3px;
    overflow: hidden
}

.file-loader-bar .mat-progress-bar .mat-progress-bar-buffer {
    background: var(--card-accent)
}

.file-loader-bar .mat-progress-bar .mat-progress-bar-background {
    fill: var(--card-accent)
}

.file-loader-bar .mat-progress-bar .mat-progress-bar-fill:after {
    background: var(--proggress-bg)
}

.file-loader-preview {
    padding: .6667rem;
    background: var(--de-bodyBg);
    border-radius: var(--de-borderRadius)
}

.file-loader-preview img {
    width: 4rem;
    height: 4rem;
    object-fit: contain;
    display: block;
    border-radius: 4px
}

.preview-file-wide {
    display: flex;
    align-items: center
}

.preview-file-wide .nft-image {
    flex: 0 0 4rem
}

.preview-file-wide__name {
    flex: 0 0 calc(100% - 7rem);
    padding-left: 1rem;
    padding-right: 2rem
}

.preview-file-wide .close-btn {
    flex: 0 0 2rem;
    text-align: right;
    margin-left: auto
}

.pagination .page-item .page-link.--prev, .pagination .page-item .page-link.--next {
    font-family: icomoon
}

.pagination .page-item .page-link.--prev:after {
    content: "\e926"
}

.pagination .page-item .page-link.--next:after {
    content: "\e925"
}

.pagination .page-item .page-link.--more:hover {
    color: var(--de-mutedColor);
    cursor: default
}

.pagination .page-item .page-link:hover:not(.disable-hover), .pagination .page-item .page-link:focus:not(.disable-hover) {
    color: var(--de-bodyColor)
}

.pagination .page-item.active .page-link, .pagination .page-item.active .page-link:hover {
    border-color: var(--de-borderColor);
    color: var(--de-primary)
}

body .ngx-pagination {
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center
}

body .ngx-pagination:before, body .ngx-pagination:after {
    content: none
}

body .ngx-pagination a {
    text-decoration: none;
    color: inherit
}

body .ngx-pagination a:hover {
    background: none
}

body .ngx-pagination li {
    margin: 0;
    background: none !important
}

body .ngx-pagination li>a, body .ngx-pagination li>span {
    height: var(--de-btnSizeMd);
    min-width: var(--de-btnSizeMd);
    font-weight: 400;
    font-size: var(--de-bodyFontSize);
    border: 1px solid transparent;
    border-radius: var(--de-borderRadius);
    color: var(--de-mutedColor);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    padding: 0 1rem
}

body .ngx-pagination li:not(.disabled):not(.current):hover a {
    color: var(--de-bodyColor);
    background: none
}

body .ngx-pagination li:not(.disabled):not(.current):not(.pagination-previous):not(.pagination-next):hover a {
    border-color: var(--de-borderColor)
}

body .ngx-pagination li.current span {
    border-color: var(--de-borderColor);
    color: var(--de-primary)
}

body .ngx-pagination li.ellipsis span {
    color: var(--de-mutedColor)
}

body .ngx-pagination li.pagination-previous, body .ngx-pagination li.pagination-next {
    padding: 0
}

body .ngx-pagination li.pagination-previous:before, body .ngx-pagination li.pagination-previous:after, body .ngx-pagination li.pagination-next:before, body .ngx-pagination li.pagination-next:after {
    content: none !important
}

body .ngx-pagination li.pagination-previous>*:before, body .ngx-pagination li.pagination-next>*:after {
    font-family: icomoon;
    color: var(--de-primary);
    font-size: 1.3334rem
}

body .ngx-pagination li.pagination-previous {
    margin-right: 1rem
}

body .ngx-pagination li.pagination-previous>*:before {
    content: "\e926" !important
}

body .ngx-pagination li.pagination-next {
    margin-left: 1rem
}

body .ngx-pagination li.pagination-next>*:after {
    content: "\e925" !important
}

body .ngx-pagination li.pagination-next.disabled, body .ngx-pagination li.pagination-previous.disabled {
    color: rgba(var(--de-primaryRGB), .6)
}

.mat-calendar {
    --mdc-icon-button-state-layer-size: 40px
}

.datepicker {
    display: inline-block
}

body .mat-calendar-body tr[aria-hidden=true] {
    display: none
}

body .mat-calendar-content {
    padding: var(--de-gapMd) var(--de-gapMd) 0
}

body .mat-calendar-header {
    padding: var(--de-gapMd)
}

body .mat-calendar-table-header-divider {
    display: none
}

body .mat-calendar-controls {
    margin: 0;
    display: flex;
    align-items: center
}

body .mat-date-range-input {
    display: block;
    border: 1px solid var(--de-borderColor);
    color: var(--de-bodyColor);
    padding: 10px 16px;
    border-radius: var(--de-borderRadiusSm)
}

body .mat-date-range-input-container {
    justify-content: center
}

body .mat-date-range-input-end-wrapper {
    flex-grow: 0
}

body .mat-datepicker-content {
    background: var(--de-dropdownBg);
    border: 1px solid var(--de-borderColor);
    box-shadow: none;
    border-radius: var(--de-borderRadiusSm);
    color: var(--de-bodyColor)
}

body .mat-datepicker-content .mat-calendar {
    width: 352px;
    height: auto
}

body .mat-datepicker-content .mat-calendar-next-button, body .mat-datepicker-content .mat-calendar-previous-button {
    color: var(--de-mutedColor)
}

body .mat-calendar-body-cell {
    width: 40px;
    height: 40px
}

body .mat-calendar-body-cell-content {
    border: none;
    border-radius: var(--de-borderRadiusSm);
    color: var(--de-mutedColor);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

body .mat-calendar-body-cell:before, body .mat-calendar-body-cell:after, body .mat-calendar-body-cell-preview {
    border-radius: var(--de-borderRadiusSm);
    top: 0;
    height: 100%;
    width: 100%
}

body .mat-calendar-controls {
    margin-top: 0
}

body .mat-calendar-body-selected {
    background: var(--de-btnPrimaryBg);
    color: var(--de-btnPrimaryTextColor)
}

body .mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    border-color: var(--de-primary)
}

body .mat-calendar-body-in-range:before {
    background: var(--de-btnSecondaryBg);
    color: var(--de-btnSecondaryTextColor)
}

body .mat-calendar-body-in-preview .mat-calendar-body-cell-content {
    background: var(--de-btnSecondaryBg);
    color: var(--de-bodyColor)
}

body .mat-calendar-body-preview-end .mat-calendar-body-cell-content, body .mat-calendar-body-preview-start .mat-calendar-body-cell-content {
    background: var(--de-btnPrimaryBg) !important;
    color: var(--de-btnPrimaryTextColor) !important
}

body .mat-datepicker-toggle, body .mat-calendar-body-label {
    color: var(--de-mutedColor)
}

body .mat-calendar-body-label:first-child {
    font-size: 0
}

body .mat-calendar-table-header {
    color: var(--de-mutedColor)
}

body .mdc-button__label:after {
    content: "\e94a";
    font-family: icomoon;
    vertical-align: middle
}

body .mat-calendar-arrow {
    display: none
}

body .mat-mdc-icon-button .mat-mdc-button-touch-target {
    width: 100%;
    height: 100%;
    border-radius: var(--de-borderRadiusSm);
    border: 1px solid var(--de-btnSecondaryBg)
}

body .mat-calendar-previous-button {
    order: 1
}

body .mat-calendar-period-button {
    order: 2;
    margin: 0 auto
}

body .mat-calendar-next-button {
    order: 3
}

body .mat-calendar-spacer {
    display: none
}

.mat-calendar-body-cell-content, .mat-date-range-input-separator {
    color: var(--de-bodyColor)
}

.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical), .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical), .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    background: var(--de-btnSecondaryBg);
    color: var(--de-btnSecondaryTextColor)
}

.mat-button.mat-primary.mat-button-disabled, .mat-button.mat-accent.mat-button-disabled, .mat-button.mat-warn.mat-button-disabled, .mat-button.mat-button-disabled.mat-button-disabled, .mat-icon-button.mat-primary.mat-button-disabled, .mat-icon-button.mat-accent.mat-button-disabled, .mat-icon-button.mat-warn.mat-button-disabled, .mat-icon-button.mat-button-disabled.mat-button-disabled, .mat-stroked-button.mat-primary.mat-button-disabled, .mat-stroked-button.mat-accent.mat-button-disabled, .mat-stroked-button.mat-warn.mat-button-disabled, .mat-stroked-button.mat-button-disabled.mat-button-disabled {
    color: var(--de-mutedColor)
}

.mat-calendar-body-disabled>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    color: var(--de-mutedColor);
    opacity: .5
}

.mat-calendar-body-today.mat-calendar-body-selected {
    box-shadow: none
}

.mat-datepicker-actions {
    flex-wrap: wrap;
    gap: var(--de-gapXs);
    justify-content: space-between !important;
    padding: var(--de-gapMd)
}

.mat-datepicker-actions .btn {
    flex: 1
}

.single-date .mat-date-range-input-separator {
    display: none
}

.breadcrumbs {
    display: flex;
    align-items: center;
    font-size: var(--de-bodyFontSizeLg);
    font-weight: 400;
    padding: 0;
    margin: 0;
    list-style: none;
    color: var(--de-bodyColor)
}

.breadcrumbs .breadcrumb-item+.breadcrumb-item:before {
    content: "/";
    display: inline-block;
    margin: 0 .3334rem 0 .6667rem;
    color: var(--de-mutedColor)
}

@media (max-width: 575.5px) {
    .breadcrumbs .breadcrumb-item:not(:last-child):not(:first-child) {
        display: none
    }
}

.breadcrumbs a {
    color: var(--de-mutedColor);
    text-decoration: none;
    transition: color .2s
}

.breadcrumbs a:hover {
    color: var(--de-bodyColor)
}

.menu-select-btn {
    background: none;
    border: none;
    padding: 0
}

.mdc-list-item__primary-text {
    display: flex;
    align-items: center
}

div.mat-mdc-menu-panel {
    background: var(--de-dropdownBg);
    color: var(--de-bodyColor);
    box-shadow: none !important
}

div.mat-mdc-menu-panel .mat-mdc-menu-content {
    padding: 0
}

@media (min-width: 1200px) {
    div.mat-mdc-menu-panel {
        background: var(--de-dropdownBg)
    }
}

div.mat-mdc-menu-panel .mat-mdc-menu-item {
    font-size: var(--de-bodyFontSize);
    line-height: 1.2;
    font-weight: 400;
    padding: 1rem;
    color: var(--de-bodyColor);
    min-height: 40px;
    border-bottom: 1px solid var(--de-borderColor)
}

div.mat-mdc-menu-panel .mat-mdc-menu-item:last-child {
    border-bottom: none
}

div.mat-mdc-menu-panel .mat-mdc-menu-item.selected, div.mat-mdc-menu-panel .mat-mdc-menu-item:hover {
    color: var(--de-mutedColor)
}

div.mat-mdc-menu-panel .mat-mdc-menu-item img {
    width: 16px;
    height: 16px;
    margin-right: 8px
}

div.mat-mdc-menu-panel.swap-network-select {
    margin-top: 1px;
    max-width: initial;
    width: calc(55vw - 2rem + 2px);
    background: var(--de-dropdownBg);
    border-top: none;
    border-radius: var(--de-borderRadius)
}

@media (min-width: 576px) {
    div.mat-mdc-menu-panel.swap-network-select {
        width: calc(33vw - 2rem + 4px)
    }
}

@media (min-width: 768px) {
    div.mat-mdc-menu-panel.swap-network-select {
        width: calc(var(--de-modalWidth) * .33 - 1rem - 4px)
    }
}

body .mat-menu-content:not(:empty) {
    padding: 0
}

.app-dropdown-menu {
    margin-top: 4px;
    width: calc(100vw - 3rem);
    max-width: initial !important;
    background: var(--de-dropdownBg);
    border-radius: var(--de-borderRadius) !important
}

.app-dropdown-menu .mat-mdc-menu-item {
    font-size: var(--text-size-lg)
}

.app-dropdown-menu .mat-mdc-menu-item .icon {
    width: 1.6rem;
    display: inline-block;
    font-size: 1.6667rem;
    vertical-align: -.2rem;
    line-height: 1
}

@media (min-width: 768px) {
    .app-dropdown-menu {
        width: 362px;
        background: var(--de-dropdownBg)
    }
}

@media (min-width: 1200px) {
    .app-dropdown-menu {
        width: 13.5rem
    }
}

.table-list__tr {
    display: flex;
    flex-direction: column;
    padding: var(--de-gapXs) 0
}

.table-list__tr:last-child {
    border-bottom: none;
    margin-bottom: 0
}

@media (max-width: 767.5px) {
    .table-list__tr-inline {
        flex-direction: row
    }

    .table-list__tr-inline .table-list__th {
        margin-bottom: 0;
        margin-right: auto
    }
}

.table-list__th {
    margin-bottom: var(--de-gapXs);
    color: var(--de-mutedColor)
}

.alert {
    border: 1px solid var(--de-borderColor);
    border-radius: var(--de-borderRadiusSm);
    padding: var(--de-gapSm);
    display: flex;
    align-items: center;
    position: relative
}

.alert:before {
    position: absolute;
    z-index: -1;
    inset: 0;
    border-radius: inherit;
    opacity: .1
}

.alert-text {
    margin-left: var(--de-gapMd)
}

.alert-primary {
    border-color: var(--de-primary)
}

.alert-primary .alert-icon {
    color: var(--de-primary)
}

.alert-warning {
    border-color: var(--de-warning)
}

.alert-warning:before {
    content: "";
    background: var(--de-warning)
}

.alert-warning .alert-icon {
    color: var(--de-warning)
}

.alert-error {
    border-color: var(--de-error)
}

.alert-error:before {
    content: "";
    background: var(--de-error)
}

.alert-error .alert-icon {
    color: var(--de-error)
}

.tag {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 4px 8px;
    font-size: 12px;
    line-height: 1.3334;
    font-weight: 400;
    border: none;
    border-radius: var(--de-borderRadiusSm);
    font-family: var(--de-fontFamilyMonospace);
    min-height: var(--de-btnSizeSm)
}

.tag .icomoon-close {
    font-size: 10px
}

.tag .icomoon-close:not(:disabled):hover {
    color: var(--de-error)
}

.tag .copy-btn {
    font-size: 12px
}

.tag-primary {
    color: var(--de-primary);
    background: var(--de-primaryTagBg)
}

.cursor-pointer.tag-primary:hover, a.tag-primary:hover, button.tag-primary:hover {
    background: rgba(var(--de-primaryRGB), .2);
    color: var(--de-primary)
}

.tag-secondary {
    background: var(--de-btnSecondaryBg);
    color: var(--de-btnSecondaryTextColor)
}

.cursor-pointer.tag-secondary:hover, a.tag-secondary:hover, button.tag-secondary:hover {
    background: var(--de-btnSecondaryBgHover);
    color: var(--de-btnSecondaryTextColorHover)
}

.tag-outline-secondary {
    border: 1px solid var(--de-btnSecondaryBg);
    color: var(--de-btnSecondaryTextColor)
}

.tag-outline-secondary:hover {
    background: var(--de-btnSecondaryBgHover);
    color: var(--de-btnSecondaryTextColorHover)
}

.tag-outline-secondary img {
    width: 12px;
    height: 12px;
    object-fit: contain
}

.tag-square {
    height: var(--de-btnSizeSm);
    width: var(--de-btnSizeSm);
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: center
}

.bridge-banner>a:after, a.bridge-banner-inner:after {
    content: "\e903";
    font-family: icomoon;
    color: var(--de-mutedColor);
    transition: all .3s;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: none
}

@media (min-width: 768px) {
    .bridge-banner>a:after, a.bridge-banner-inner:after {
        right: 3rem;
        display: block
    }
}

.bridge-banner>a:hover:after, a.bridge-banner-inner:hover:after {
    transform: translate(4px, -50%)
}

.bridge-banner {
    border-radius: var(--de-borderRadius);
    border: var(--de-borderWidth) solid var(--de-borderColor);
    background-color: var(--de-controlBg);
    overflow: hidden;
    position: relative;
    margin-bottom: 1rem
}

.bridge-banner>a, .bridge-banner-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

.bridge-banner__close {
    position: absolute;
    right: 0;
    top: 0;
    padding: 1rem
}

.bridge-banner__close:hover {
    color: var(--de-warning)
}

@media (min-width: 375px) {
    .bridge-banner__link {
        text-align: right
    }
}

.bridge-banner__img {
    display: none;
    width: 92px;
    flex: 0 0 92px;
    height: 96px
}

@media (min-width: 768px) {
    .bridge-banner__img {
        display: block
    }
}

.bridge-banner__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--de-borderRadiusSm) 0 0 var(--de-borderRadiusSm)
}

.bridge-banner__content {
    flex: 1;
    padding: var(--de-gapMd);
    padding-right: 3rem;
    position: relative
}

@media (min-width: 768px) {
    .bridge-banner__content {
        padding: var(--de-gapSm) var(--de-gapMd);
        padding-right: 4rem
    }
}

.page-notification {
    display: block;
    color: var(--bannerTextColorDark);
    background: var(--bannerColorDark);
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
    font-family: Onest, sans-serif;
    position: relative;
    z-index: 1;
    text-align: center;
    overflow: hidden;
    padding: 16px calc(var(--bs-gutter-x) / 2);
    border-bottom: 1px solid var(--de-borderColor)
}

@media (min-width: 768px) {
    .page-notification {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        font-size: 16px
    }
}

.page-notification__bold {
    color: var(--de-primary);
    width: 100%
}

.light-mode .page-notification__bold {
    color: #cc2b4a
}

@media (min-width: 768px) {
    .page-notification__bold {
        width: auto
    }
}

.page-notification .icon {
    font-size: 12px;
    color: #fff
}

.page-notification img {
    vertical-align: -4px
}

@media (min-width: 768px) {
    .page-notification img {
        vertical-align: initial
    }
}

.page-notification a:not(.btn) {
    text-decoration: none;
    border-bottom: 1px dashed var(--de-mutedColor);
    margin-top: 2px;
    color: var(--de-primary)
}

.page-notification__btn {
    border-radius: 0;
    text-transform: uppercase;
    text-decoration: underline;
    padding: 0;
    font-weight: 500;
    font-size: var(--de-bodyFontSize);
    line-height: 15px;
    margin-left: 0
}

@media (max-width: 767.5px) {
    .page-notification__btn {
        background: none;
        color: var(--de-primary)
    }
}

@media (min-width: 768px) {
    .page-notification__btn {
        text-decoration: none;
        margin-left: 8px;
        padding: 8px
    }
}

@media (min-width: 1200px) {
    .page-notification__btn {
        font-size: var(--de-bodyFontSize);
        line-height: 1.3;
        padding: 11px 20px;
        margin-left: 20px
    }
}

.light-mode .page-notification {
    color: var(--bannerTextColorLight);
    background: var(--bannerColorLight)
}

body.has-notification .page-wrap {
    min-height: calc(var(--app-height) - var(--notifications-height))
}

.widget-auto-height {
    overflow: hidden
}

body.widget-mode-body .page-wrap {
    min-height: initial;
    display: block
}

body.widget-mode-body app-order-creation {
    flex: initial;
    padding: 0
}

body.widget-mode-body app-select-token {
    --footer-height: 0px
}

body.widget-mode-body .modal-header {
    padding-top: 1rem;
    padding-bottom: 1rem
}

@media (max-width: 320px) {
    body.widget-mode-body .swap-form-card.is-logged .form-card-title {
        width: 100%;
        margin-bottom: 1rem
    }

    body.widget-mode-body .deport-form.is-logged .form-card-subtitle:first-child {
        max-width: calc(100% - 12rem);
        text-align: left
    }
}

@media (max-width: 575.5px) {
    body.widget-mode-body .__mode-header .form-card-title {
        margin-bottom: 1rem
    }

    body.widget-mode-body .deport-form .form-card__header {
        flex-wrap: wrap
    }

    body.widget-mode-body .deport-form .form-card-subtitle:nth-child(2)+.widget-wallet {
        margin: .5rem 0 0 auto
    }
}

body.widget-mode-body.form-bg-is-transparent .deport-form.loading, body.widget-mode-body.form-bg-is-transparent .form-container.loading {
    opacity: .75
}

body.widget-mode-body.form-bg-is-transparent .deport-form.loading .preloader-above:after, body.widget-mode-body.form-bg-is-transparent .form-container.loading .preloader-above:after {
    background: none
}

body.widget-mode-body.form-bg-is-transparent .send-form__switch .switch-chains-btn:not(:hover) {
    background: var(--de-secondary)
}

body.widget-mode-body .wallet-list {
    max-height: calc(100vh - 83px)
}

.widget-wallet {
    align-self: center;
    border-radius: var(--de-borderRadiusSm);
    padding: .3334rem .6667rem
}

.widget-wallet .icomoon-wallet {
    font-size: 1.3334rem
}

.widget-wallet-modal .__connected-wallet {
    display: block !important;
    width: 100%
}

.deport-form .form-card-subtitle:first-child {
    margin-right: auto
}

.deport-form .form-card-subtitle:first-child:last-child {
    margin-left: auto
}

@media (max-width: 400px) {
    .deport-form .form-card-subtitle:first-child:last-child {
        max-width: 100%;
        text-align: center
    }
}

.deport-form .form-card-subtitle:nth-child(2) {
    margin-left: 1rem
}

.deport-form .widget-wallet {
    margin-left: 1rem
}

.builder-preview .debridge-widget-iframe {
    box-shadow: 0 0 50px 5px rgba(var(--de-primaryRGB), .06)
}

@media (min-width: 768px) {
    html[lang=fr] .__select-variant .mat-button-toggle-button {
        font-size: 12px;
        padding-right: 8px;
        padding-left: 8px
    }
}

@media (max-width: 576px) {
    html[lang=fr] .__exfee-tooltip {
        display: inline-block !important;
        max-width: calc(100% - 30px)
    }

    html[lang=fr] .de-tooltip:hover:not(.de-tooltip-click) .__included-gas-tooltip {
        transform: translate(0)
    }

    html[lang=fr] .__included-gas-tooltip {
        left: -2rem;
        transform: translateY(5px)
    }

    html[lang=fr] .__included-gas-tooltip:before {
        left: 2.5rem
    }

    html[lang=fr] .__calldata-title {
        display: inline-block !important;
        max-width: calc(100% - 30px)
    }

    html[lang=jp] .__transaction-tooltip {
        width: 160px !important
    }

    html[lang=jp] .__calldata-title {
        display: inline-block !important;
        max-width: calc(100% - 30px)
    }

    html[lang=jp] .__fallback-tooltip {
        letter-spacing: -1px
    }

    html[lang=ko] .__fallback-tooltip .de-tooltip-content, html[lang=zh] .__fallback-tooltip .de-tooltip-content {
        width: 130px !important
    }

    html[lang=ru] .__nonce-tooltip {
        max-width: calc(100% - 20px)
    }

    html[lang=vi] .__recommend-exfee-btn {
        max-width: 62px;
        line-height: 1.2;
        font-size: 10px;
        padding: 3px
    }
}

html[lang=fr] .included-gas-fee {
    letter-spacing: -.07em
}

@media (max-width: 575px) {
    html[lang=en] app-bridge .__execution-tooltip {
        margin-left: 24px
    }

    html[lang=en] app-bridge .__execution-tooltip:before {
        margin-left: -24px
    }

    html[lang=jp] app-bridge .__execution-tooltip, html[lang=ko] app-bridge .__execution-tooltip, html[lang=zh] app-bridge .__execution-tooltip {
        margin-left: 50px
    }

    html[lang=jp] app-bridge .__execution-tooltip:before, html[lang=ko] app-bridge .__execution-tooltip:before, html[lang=zh] app-bridge .__execution-tooltip:before {
        margin-left: -50px
    }
}

html[lang=ru] .order-table-footer.tx-card__footer .tx-attr__title, html[lang=fr] .order-table-footer.tx-card__footer .tx-attr__title {
    flex: 0 0 10rem;
    padding-right: 1rem;
    margin-right: 0
}

@media (min-width: 768px) {
    html[lang=ru] .order-table-footer.tx-card__footer .tx-attr__title, html[lang=fr] .order-table-footer.tx-card__footer .tx-attr__title {
        flex: 0 0 14rem
    }
}

body {
    --send-form-padding: var(--de-formGroupPadding-top) var(--de-formGroupPadding-left) var(--de-formGroupPadding-right) var(--de-formGroupPadding-bottom)
}

.swap-form-wrap {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column
}

@media (min-width: 768px) {
    .swap-form-wrap {
        width: var(--de-modalWidth);
        flex: 0 0 var(--de-modalWidth)
    }
}

.bridge-input-group {
    display: flex;
    position: relative;
    border-radius: var(--de-borderRadiusSm);
    border: var(--de-borderWidth) solid var(--de-controlBorder);
    background-color: var(--de-controlBg);
    min-height: 60px
}

.bridge-input-group__token {
    display: flex;
    align-items: center;
    flex: 0 0 124px;
    width: 124px;
    border-right: var(--de-borderWidth) solid var(--de-controlBorder)
}

.bridge-input-group__token .dropdown-button {
    padding: var(--de-gapMd) var(--de-gapSm);
    font-size: var(--de-h3FontSize);
    line-height: 1;
    width: 100%
}

.bridge-input-group__token .dropdown-button:after {
    margin-left: auto;
    padding-left: 4px
}

.bridge-input-group__token .dropdown-button .token-chain {
    flex: 0 0 20px;
    margin-right: var(--de-gapXs)
}

.bridge-input-group__token .dropdown-button .token-chain__chain {
    background-color: var(--de-controlBg)
}

.bridge-input-group__token .dropdown-button .token-symbol {
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: calc(100% - 40px)
}

@media (max-width: 300px) {
    .bridge-input-group__token {
        flex: 0 0 98px;
        width: 98px
    }

    .bridge-input-group__token .dropdown-button {
        font-size: var(--de-bodyFontSize);
        padding: var(--de-gapMd) var(--de-gapXs)
    }

    .bridge-input-group__token .dropdown-button:after {
        font-size: 10px
    }

    .bridge-input-group__token .dropdown-button .token-chain {
        flex: 0 0 16px
    }

    .bridge-input-group__token .logo-sm {
        width: 16px;
        height: 16px
    }
}

.bridge-input-group__amount {
    flex: 1;
    max-width: calc(100% - 124px);
    position: relative;
    display: flex;
    align-items: center
}

@media (max-width: 300px) {
    .bridge-input-group__amount {
        max-width: calc(100% - 98px)
    }
}

.bridge-input-group__amount .input-auto-width-value {
    visibility: hidden;
    position: absolute;
    height: 0;
    font-size: var(--de-h3FontSize);
    padding: var(--de-gapMd);
    max-width: 100%;
    overflow: hidden
}

.bridge-input-group__amount input {
    font-size: var(--de-h3FontSize);
    line-height: 1.4;
    height: 100%;
    padding: var(--de-gapMd);
    max-width: 100%
}

@media (max-width: 300px) {
    .bridge-input-group__amount input {
        padding: var(--de-gapMd) var(--de-gapXs)
    }
}

.bridge-input-group__amount input:focus {
    z-index: 2;
    position: relative;
    background: linear-gradient(90deg, var(--de-controlBg) 95%, rgba(0, 0, 0, 0) 100%)
}

.bridge-input-group__amount input:disabled {
    opacity: 1
}

.send-form__to, .send-form__from {
    padding: var(--send-form-padding);
    border-radius: var(--de-borderRadius);
    border: var(--de-borderWidth) solid var(--de-borderColor)
}

.send-form__switch {
    text-align: center;
    height: var(--de-gapXs)
}

.send-form__switch .switch-chains-btn {
    transform: translateY(-50%);
    margin-top: calc(var(--de-gapXs) / 2)
}

.send-form__switch .switch-chains-btn:not(:hover) {
    background: var(--de-bodyBg)
}

.send-form__errors .alert {
    margin-top: var(--de-gapMd)
}

.send-form__errors .alert:last-child {
    margin-bottom: var(--de-gapMd)
}

.send-form__errors:last-child .alert:last-child {
    margin-bottom: 0;
    margin-top: 0
}

.send-form-receiver {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    background: var(--de-cardBg);
    border-radius: var(--de-borderRadius);
    border: var(--de-routingBorderWidth, var(--de-borderWidth)) solid var(--de-borderColor)
}

@media (min-width: 576px) {
    .send-form-receiver {
        flex-direction: row
    }
}

.send-form-receiver__checkbox {
    padding: var(--de-routingPadding, var(--send-form-padding))
}

.send-form-receiver__address {
    padding: 0 var(--de-formGroupPadding-left) var(--de-formGroupPadding-right) var(--de-formGroupPadding-bottom);
    width: 100%
}

@media (min-width: 576px) {
    .send-form-receiver__address {
        order: 3
    }
}

.send-form-receiver__routing-toggle {
    display: flex;
    align-items: center;
    width: 100%;
    padding: var(--de-routingPadding, var(--send-form-padding));
    border-top: var(--de-borderWidth) solid var(--de-borderColor)
}

.send-form-receiver__routing-toggle .toggle-icon {
    margin-right: auto
}

.send-form-receiver__routing-toggle:first-child {
    border-top: none;
    margin-left: 0
}

.send-form-receiver__routing-toggle:first-child .toggle-icon {
    margin-right: 1rem
}

@media (min-width: 576px) {
    .send-form-receiver__routing-toggle {
        width: auto;
        border-top: none;
        margin-left: auto
    }
}

.send-form-receiver__routing {
    width: 100%
}

@media (min-width: 576px) {
    .send-form-receiver__routing {
        order: 4
    }
}

.select-group-head {
    display: flex;
    align-items: flex-end
}

.select-group-head .select-group-label {
    margin-bottom: .6667rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.select-group-head .select-group-label__title {
    width: 100%
}

@media (min-width: 576px) {
    .select-group-head .select-group-label__title {
        width: auto;
        margin-right: auto
    }
}

.select-group-head .select-group-label:last-child {
    margin-left: auto
}

.select-group-head .select-group-label:last-child:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0
}

.select-group-head .select-group-label .balance {
    margin-right: auto
}

@media (min-width: 576px) {
    .select-group-head .select-group-label .balance {
        margin-right: 0
    }

    .select-group-head .select-group-label:first-child {
        width: 33%;
        margin-left: 2px
    }

    .select-group-head .select-group-label:last-child {
        margin-left: 0
    }
}

.select-group {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    border-radius: var(--de-borderRadiusSm);
    border: var(--de-borderWidth) solid var(--de-borderColor);
    background: var(--de-controlBg)
}

.select-group app-networks-list {
    width: 100%
}

.select-group__chain {
    flex: 0 0 55%;
    margin-bottom: 8px;
    margin-right: 8px
}

@media (min-width: 576px) {
    .select-group__chain {
        flex: 0 0 33%;
        width: 33%;
        margin-bottom: 0
    }
}

.select-group__token {
    flex: 0 0 calc(45% - 2px);
    max-width: calc(45% - 2px);
    margin-bottom: 8px
}

@media (min-width: 576px) {
    .select-group__token {
        flex: 0 0 25%;
        max-width: 25%;
        margin-bottom: 0;
        margin-right: 2px
    }
}

.select-group__value {
    flex: 0 0 100%;
    position: relative
}

.select-group__value:not(:last-child) {
    flex: 0 0 calc(100% - 64px)
}

.select-group__value.fee-form .fee-form__controls {
    flex: 0 0 100%;
    border-radius: var(--de-borderRadius)
}

@media (min-width: 576px) {
    .select-group__value.fee-form .fee-form__controls {
        padding: 1.445rem 1rem
    }
}

.select-group__value.fee-form input {
    font-size: var(--text-size-xl)
}

@media (min-width: 576px) {
    .select-group__value {
        flex: 0 0 calc(42% - 4px)
    }

    .select-group__value:not(:last-child) {
        flex: 0 0 calc(42% - 4px)
    }
}

.select-group__btn {
    flex: 0 0 56px;
    margin-left: 8px
}

@media (min-width: 576px) {
    .select-group__btn {
        position: absolute;
        right: 0;
        top: 0;
        transform: translateY(-100%);
        margin-top: -.75rem
    }
}

.select-group__btn .__send-to__recommend, .select-group__btn .__send-from__max {
    padding: 1rem;
    width: 56px;
    line-height: 2;
    border-radius: var(--de-borderRadius)
}

@media (min-width: 300px) {
    .select-group__btn .__send-to__recommend, .select-group__btn .__send-from__max {
        padding: 1.3334rem 1rem
    }
}

@media (min-width: 576px) {
    .select-group__btn .__send-to__recommend, .select-group__btn .__send-from__max {
        padding: .2084rem .34rem;
        line-height: 1;
        width: auto;
        border-radius: calc(var(--de-borderRadius) / 3)
    }
}

.select-group__btn .__send-to__recommend {
    width: 11rem
}

.select-group.select-group-inline .select-group__chain {
    margin-right: 2px
}

.select-group.select-group-inline .select-group__chain .select-group-trigger {
    border-radius: var(--de-borderRadius) 0 0 var(--de-borderRadius)
}

.select-group.select-group-inline .select-group__token .select-group-trigger {
    border-radius: 0 var(--de-borderRadius) var(--de-borderRadius) 0
}

@media (min-width: 576px) {
    .select-group.select-group-inline .select-group__token .select-group-trigger {
        border-radius: 0
    }
}

.select-group.select-group-inline .select-group__value .blur-loader {
    border-radius: var(--de-borderRadius)
}

@media (min-width: 576px) {
    .select-group.select-group-inline .select-group__value .blur-loader {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }
}

@media (min-width: 576px) {
    .select-group.select-group-inline .select-group__value input {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }
}

.select-group-trigger {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1rem 2rem 1rem .6667rem;
    color: var(--de-bodyColor);
    font-size: var(--text-size-lg);
    background: var(--de-controlBg);
    font-weight: 400;
    line-height: 2rem;
    height: 100%;
    border-radius: var(--de-borderRadius)
}

@media (min-width: 300px) {
    .select-group-trigger {
        padding: 1.3334rem;
        font-size: var(--text-size-xl)
    }
}

.select-group-trigger .text-overflow {
    white-space: nowrap
}

@media (max-width: 299.5px) {
    .select-group-trigger .token-chain {
        margin-right: .6667rem
    }

    .select-group-trigger .token-chain>img {
        width: 1.3334rem;
        height: 1.3334rem
    }

    .select-group-trigger .token-chain__chain {
        width: 1rem;
        height: 1rem
    }
}

.select-group-trigger.has-native-color {
    background: var(--select-chain-backdrop)
}

.select-group-trigger__text {
    display: inline-block;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis
}

.select-group-trigger.select-network-tokens {
    font-size: var(--text-size-lg);
    font-weight: 300;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.fee-form {
    display: flex;
    flex-wrap: wrap;
    margin-top: 1.3334rem
}

.fee-form__title {
    flex: 0 0 100%;
    margin-bottom: 8px
}

.fee-form__controls {
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    position: relative;
    padding: .5rem .5rem .5rem 1.3334rem;
    background: var(--de-controlBg);
    border-radius: var(--de-borderRadiusSm)
}

@media (min-width: 576px) {
    .fee-form__controls {
        padding-left: 1rem
    }
}

.fee-form__input {
    padding-right: var(--de-gapSm)
}

.fee-form__symbol {
    margin-left: auto
}

.fee-form__recommended {
    flex: 0 0 auto;
    padding: .5rem .66rem
}

@media (min-width: 576px) {
    .fee-form {
        margin-top: .6667rem
    }

    .fee-form__title {
        flex: 0 0 33%;
        margin-bottom: 0
    }

    .fee-form__controls {
        flex: 0 0 67%
    }

    .fee-form__recommended {
        padding: .0835rem .5rem
    }
}

.__recommended-tooltip {
    width: 9rem
}

@media (min-width: 768px) {
    .__recommended-tooltip {
        width: 12.3rem
    }
}

.latest-orders-table .order-status-ClaimedUnlock, .latest-orders-table .order-status-Fulfilled, .latest-orders-table .order-status-SentUnlock {
    color: var(--de-success)
}

.latest-orders-table .order-status-orderCanceling, .latest-orders-table .order-status-OrderCancelled, .latest-orders-table .order-status-SentOrderCancel, .latest-orders-table .order-status-ClaimedOrderCancel {
    color: var(--de-error)
}

.send-form-steps .step-nav {
    padding: var(--card-padding)
}

.token-list .cdk-virtual-scroll-content-wrapper {
    right: 0
}

.form-card-subtitle {
    font-size: var(--de-descriptionFontSize, 14px)
}

.tx-attr {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

.tx-attr__title, .tx-attr__value {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%
}

@media (min-width: 768px) {
    .tx-attr:not(.tx-attr-wrap) .tx-attr__title, .tx-attr:not(.tx-attr-wrap) .tx-attr__value {
        flex: 0 0 auto;
        width: auto
    }

    .tx-attr:not(.tx-attr-wrap) .tx-attr__title {
        margin-right: auto;
        margin-bottom: 0;
        padding-right: 1rem
    }
}

.tx-attr__title {
    color: var(--de-mutedColor);
    margin-bottom: var(--de-gapXs)
}

.tx-attr__row {
    flex: 0 0 100%;
    width: 100%
}

.tx-value {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    word-wrap: break-word;
    word-break: break-word
}

.tx-value-copy {
    display: flex;
    align-items: center
}

.tx-value-copy .copy-btn {
    margin-left: var(--de-gapMd)
}

.info-group-collapse {
    display: flex;
    flex-wrap: wrap
}

.info-group-collapse__col {
    width: 100%;
    padding: var(--de-gapMd);
    border-top: 1px solid var(--de-borderColor);
    display: flex;
    align-items: center
}

.info-group-collapse__col:first-child {
    border-top: none
}

.info-group-collapse__col .tx-attr {
    width: 100%
}

@media (min-width: 768px) {
    .info-group-collapse__col:not(.w-100) {
        width: 50%
    }

    .info-group-collapse__col:nth-child(2) {
        border-top: none
    }

    .info-group-collapse__col:nth-child(odd) {
        border-right: 1px solid var(--de-borderColor)
    }

    .info-group-collapse__col:last-child:nth-child(odd) {
        width: 100%;
        border-right: none
    }
}

.info-group-collapse__head {
    width: 100%
}

.info-group-collapse__head:not(:last-child) {
    border-bottom: 1px solid var(--de-borderColor)
}

.info-group-collapse__row {
    display: flex;
    flex-wrap: wrap;
    width: 100%
}

.info-group-collapse__row:not(:last-child) {
    border-bottom: 1px solid var(--de-borderColor)
}

:root {
    --app-height: 100%;
    --notifications-height: 40px;
    --header-height: 70px;
    --footer-height: 177px;
    --scrollbar-width: 8px;
    --select-chain-backdrop: "none";
    --de-displayChainsColor: "block";
    --de-formPadding-top: 1.3334rem;
    --de-formPadding-bottom: 1.3334rem;
    --de-formPadding-right: calc(var(--bs-gutter-x)* .5);
    --de-formPadding-left: calc(var(--bs-gutter-x)* .5);
    --de-formGroupPadding-top: var(--de-gapMd);
    --de-formGroupPadding-left: var(--de-gapMd);
    --de-formGroupPadding-right: var(--de-gapMd);
    --de-formGroupPadding-bottom: var(--de-gapMd)
}

@media (min-width: 768px) {
    :root {
        --header-height: 84px
    }
}

@media (min-width: 992px) {
    :root {
        --header-height: 104px
    }
}

body {
    background: var(--de-bodyBg);
    --wcm-z-index: 1090
}

@media (max-width: 767.5px) {
    .active-fixed-search app-root {
        overflow: hidden;
        height: var(--app-height)
    }
}

@media (max-width: 767.5px) {
    .widget-mode-body app-root, .form-style app-root {
        background: var(--de-bodyBg)
    }
}

.dark-mode input {
    color-scheme: dark
}

.dark-mode .line-style .order-status__grid {
    opacity: .12
}

.light-mode .bolder-on-light {
    font-weight: 500
}

.light-mode .order-status__grid {
    opacity: .2
}

.light-mode .invert-on-light, .light-mode img[src*="no-icon.svg"] {
    filter: invert(1)
}

.light-mode img[src*="no-icon-fill.svg"] {
    filter: brightness(200%);
    -webkit-filter: brightness(200%);
    -moz-filter: brightness(200%)
}

.light-mode img[src*="no-nft.svg"] {
    filter: brightness(.5)
}

.light-mode img[src*="gnosis.svg"].wallet-logo {
    filter: invert(1)
}

.light-mode img[src*="cup-gold.svg"] {
    filter: hue-rotate(-21deg) contrast(.6)
}

.light-mode img[src*="wallet/default.svg"] {
    filter: hue-rotate(181deg) invert(1)
}

.address-copy {
    display: inline-flex;
    align-items: center
}

.address-copy .copy-btn {
    margin-left: .5rem
}

.address-copy.form-control .copy-btn {
    margin-left: auto
}

.validator-card {
    display: flex;
    align-items: center
}

@media (max-width: 576px) {
    .validator-card {
        align-items: center
    }
}

.validator-card img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    border-radius: 4px
}

@media (min-width: 768px) {
    .validator-card img {
        width: 40px;
        height: 40px
    }
}

.validator-card__title {
    font-size: var(--de-bodyFontSizeLg)
}

@media (min-width: 768px) {
    .validator-card__title {
        margin-bottom: 4px
    }
}

.validator-card__address {
    color: var(--de-mutedColor)
}

@media (min-width: 768px) {
    .validator-card__address {
        font-size: var(--de-bodyFontSizeLg)
    }
}

.assets-currency {
    display: inline-flex;
    min-height: 26px;
    padding: 5px 12px 5px 34px;
    background: var(--de-btnSecondaryBg);
    border-radius: 32px;
    position: relative;
    text-decoration: none !important
}

.assets-currency>a {
    position: absolute;
    inset: 0
}

.assets-currency img {
    display: block;
    position: absolute;
    left: -1px;
    top: 50%;
    width: 26px;
    height: 26px;
    border-radius: 100%;
    overflow: hidden;
    object-fit: cover;
    transform: translateY(-50%)
}

.assets-currency__sep {
    border-left: 1px solid var(--de-borderColor);
    margin: -5px 8px;
    display: inline-block
}

@media (min-width: 2560px) {
    .assets-currency {
        min-height: 30px;
        padding: 10px 16px 10px 40px
    }

    .assets-currency img {
        width: 32px;
        height: 32px
    }
}

.line-separator {
    border: none;
    border-top: 1px solid var(--de-borderColor)
}

@media (min-width: 1366px) {
    .wrong-network~app-swap app-charts {
        max-height: calc(100vh - 25rem) !important
    }
}

.list-inline {
    display: flex;
    align-items: center
}

.list-inline li {
    margin-right: 2rem
}

.list-inline li:last-child {
    margin-right: 0
}

.page-head {
    padding: var(--de-gapXl) 0
}

.page-head.page-head-underline {
    border-bottom: 1px solid var(--de-borderColor)
}

.page-head .page-title {
    margin-bottom: 0
}

.page-head .breadcrumbs+.page-title {
    margin-top: var(--de-gapSm)
}

.transition {
    transition: all .2s
}

.external-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    position: relative
}

.external-link.muted {
    color: var(--de-mutedColor)
}

.external-link.muted:hover {
    color: var(--de-bodyColor)
}

.external-link:after {
    content: "\e922";
    font-family: icomoon;
    font-size: 70%;
    margin-left: .5rem;
    position: relative;
    transition: all .3s
}

.external-link:hover:after {
    color: var(--de-primary);
    transform: translate(.1rem, -.1rem)
}

.icomoon-deSwap-icon .path2:before, .icomoon-deSwap-icon .path3:before {
    color: var(--de-bodyColor)
}

.light-mode .icomoon-deSwap-icon .path2:before, .light-mode .icomoon-deSwap-icon .path3:before {
    color: #999
}

.for-search {
    max-width: 15rem;
    position: absolute;
    color: #0000 !important;
    overflow: hidden;
    padding: .625rem .7rem;
    left: 0;
    right: 0;
    top: 0;
    cursor: default;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis
}

@media (min-width: 576px) {
    .for-search {
        max-width: 24rem
    }
}

.short-address-search span {
    font-size: 0;
    line-height: 1
}

.short-address-search span:after {
    content: "...";
    font-size: 1rem
}

.exchange-icon {
    color: var(--de-mutedColor);
    transform: rotate(90deg) translate(0);
    font-size: var(--text-size-lg)
}

.node-status {
    font-size: 10px;
    line-height: 1;
    color: var(--de-success);
    display: flex;
    align-items: center
}

.node-status:after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background: var(--de-success);
    margin-left: 8px
}

.node-status.text-warning:after {
    background: var(--de-warning) !important
}

.node-status.text-error:after {
    background: var(--de-error) !important
}

.token-chain {
    position: relative;
    display: inline-block
}

.token-chain>a {
    position: absolute;
    inset: 0
}

.token-chain img {
    display: block;
    max-height: 100%;
    max-width: 100%
}

.token-chain__chain {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(37%, -37%);
    background: var(--de-bodyBg);
    padding: 2px;
    border-radius: 100%;
    width: 70%;
    height: 70%
}

.token-chain__link {
    position: absolute;
    inset: 0
}

.token-chain .iaas-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 1.3334rem;
    height: 1.3334rem;
    transform: translate(37%, 37%);
    padding: 3px;
    font-size: 8px;
    background: var(--de-dropdownBg)
}

.walletconnect-modal__mobile__toggle a {
    color: #000
}

.order-status__title small {
    display: block
}

.charts-pro-mode .chart-type-notify .chart-body {
    display: none !important
}

.link-inside {
    display: inline-block;
    position: relative
}

.link-inside a {
    position: absolute;
    display: block;
    inset: 0
}

.reset-link {
    text-decoration: none;
    color: inherit
}

body:not(.widget-mode-body) .solflare-metamask-wallet-adapter-iframe iframe:not([style*=" width: 100%"]) {
    bottom: 19px !important;
    left: 80px !important
}

.order-status-inline {
    flex-direction: column
}

@media (min-width: 1200px) {
    .order-status-inline {
        flex-direction: row
    }
}

.order-status-inline small {
    display: block;
    flex: 0 0 100%
}

@media (min-width: 1200px) {
    .order-status-inline small {
        margin-left: .4rem;
        display: inline;
        flex: 0 0 auto;
        font-size: inherit
    }
}

.contract-entered-tooltip b {
    font-weight: inherit;
    color: var(--de-bodyColor)
}

.network-type-badge {
    display: inline-block;
    padding: .2rem;
    line-height: 1;
    background: var(--de-dropdownBg);
    color: var(--de-mutedColor);
    font-size: .83rem !important
}

.network-type-img {
    display: block;
    width: 1.3334rem;
    height: 1.3334rem;
    object-fit: contain
}

.iaas-badge {
    display: flex;
    align-items: center;
    text-transform: none;
    color: var(--de-iconColor);
    font-weight: 300;
    background: var(--de-bodyBg);
    border-radius: 4px;
    padding: 4px 5px
}

.iaas-badge .icomoon-iaas {
    font-size: 12px;
    margin-right: .4rem
}

.iaas-badge .icomoon-iaas .path1:before, .iaas-badge .icomoon-iaas .path2:before, .iaas-badge .icomoon-iaas .path3:before {
    color: var(--de-mutedColor)
}

.iaas-badge-icon {
    font-size: 10px;
    height: 20px;
    width: 20px;
    border-radius: 100%;
    background: var(--de-btnSecondaryBg)
}

.iaas-badge-icon .icomoon-iaas {
    font-size: inherit
}

.iaas-badge-icon-wrap {
    position: relative
}

.iaas-badge-icon-wrap .iaas-badge-icon {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1.3334rem;
    height: 1.3334rem;
    transform: translate(73%, -37%);
    padding: 3px;
    font-size: 8px;
    background: var(--de-dropdownBg)
}

.dropdown-menu__item .iaas-badge {
    padding: 2px 4px
}

.button-toggle-networks .iaas-badge {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    flex-direction: column;
    padding: 0 6px 0 0;
    color: var(--de-mutedColor);
    font-size: 9px;
    line-height: 1
}

.button-toggle-networks .iaas-badge .icomoon-iaas {
    margin-right: 0
}

.button-toggle-networks .iaas-badge .path1:before, .button-toggle-networks .iaas-badge .path2:before, .button-toggle-networks .iaas-badge .path3:before {
    color: var(--de-mutedColor)
}

.tradingview-chart iframe {
    min-height: 400px
}

.debridge-widget-iframe {
    max-width: 100%;
    border-radius: var(--de-borderRadius);
    overflow: hidden
}

.inactive-d-none {
    display: none
}

.inactive-d-none.active {
    display: block
}

.social-links {
    display: flex;
    align-items: center
}

.social-links a {
    color: var(--de-bodyColor);
    text-decoration: none;
    font-size: 20px
}

.social-links a+a {
    margin-left: 1.5rem
}

.social-links a:hover {
    color: var(--de-primary)
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

::-webkit-scrollbar-track {
    border-radius: 8px;
    background: var(--de-scrollTrack)
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background: var(--de-scrollThumb);
    border: 1px solid var(--de-scrollTrack);
    opacity: .6
}

::-webkit-scrollbar-thumb:hover {
    opacity: 1;
    background: var(--de-scrollThumb)
}

.no-scroll-bar::-webkit-scrollbar {
    width: 0;
    height: 0;
    background: transparent
}

.no-scroll-bar {
    scrollbar-width: none;
    -ms-overflow-style: none
}

.scroll-x-auto {
    overflow-x: auto;
    overflow-y: hidden
}

.cursor-pointer.icon:hover {
    color: var(--de-primary)
}

.toggle-icon {
    cursor: pointer;
    color: var(--de-mutedColor)
}

.toggle-icon:hover {
    color: var(--de-bodyColor)
}

.icon-box {
    width: 60px;
    height: 60px;
    border-radius: 100%;
    background: var(--de-controlBg);
    border: var(--de-borderWidth) solid var(--de-borderColor);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: var(--de-mutedColor);
    position: relative
}

.icon-box.loading:before {
    display: block;
    position: absolute;
    left: -1px;
    top: -1px;
    width: 62px;
    height: 62px;
    content: url("data:image/svg+xml,%3Csvg width='62' height='62' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle opacity='0.7' cx='25' cy='25' r='24' transform='rotate(-90 25 25)' stroke='url(%23paint0_linear_3616)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_3616' x1='1.38009' y1='25' x2='48.8439' y2='25.0464' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D5D931'/%3E%3Cstop offset='1' stop-color='%234C5622' stop-opacity='0.1'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    animation: rotate 1s infinite linear
}

:root {
    --de-borderWidth: 1px;
    --de-btnFontSize: 14px;
    --de-btnFontWeight: 400;
    --de-btnSizeSm: 24px;
    --de-btnSizeMd: 40px;
    --de-btnSizeLg: 68px;
    --de-controlSize: 20px;
    --de-formHeadBtnSize: 40px;
    --container-width: 1238px;
    --de-borderRadius: 8px;
    --loader-dark: #000000;
    --de-primaryRGB: 213, 217, 49;
    --de-btnPadding-top: 10px;
    --de-btnPadding-right: 16px;
    --de-btnPadding-bottom: 10px;
    --de-btnPadding-left: 16px;
    --de-chainBtnPadding: 9px 16px;
    --de-gapXs: .6667rem;
    --de-gapSm: 1rem;
    --de-gapMd: 1.3334rem;
    --de-gapLg: 2rem;
    --de-gapXl: 2.6667rem;
    --de-cardPadding: 1.3334rem;
    --bs-gutter-x: 2rem;
    --de-modalWidth: 500px;
    --token-heigh: 56px;
    --min-tokens-per-view: 4;
    --theme-btnFontWeigh: 400
}

@media (min-width: 992px) {
    :root {
        --bs-gutter-x: 3rem
    }
}

@media (min-width: 2560px) {
    :root {
        --container-width: 1580px
    }
}

body {
    --de-btnLoaderBg: var(--de-primary)
}

.dark-mode {
    --de-bodyBg: #000217;
    --de-accentBg: #161B26;
    --de-bodyColor: #E6EDE4;
    --de-mutedColor: #A7ADA5;
    --de-primary: #13f2ff;
    --de-secondary: #1F242F;
    --de-iconColor: #A7ADA5;
    --de-success: #32CD32;
    --de-warning: #DC7941;
    --de-error: #C04563;
    --de-borderColor: #1F242F;
    --de-borderLightColor: #2A313F;
    --de-btnPrimaryBg: #13f2ff;
    --de-btnPrimaryBgHover: #13f2ff;
    --de-btnPrimaryBgDisabled: #4C5622;
    --de-btnPrimaryTextColor: #03111C;
    --de-btnPrimaryTextColorHover: #03111C;
    --de-btnPrimaryTextColorDisabled: #03111C;
    --de-primaryTagBg: rgba(213, 217, 49, .1);
    --de-btnSecondaryBg: #1F242F;
    --de-btnSecondaryBgHover: #2A313F;
    --de-btnSecondaryBgDisabled: #161B26;
    --de-btnSecondaryTextColor: #E6EDE4;
    --de-btnSecondaryTextColorHover: #E6EDE4;
    --de-btnSecondaryTextColorDisabled: #A7ADA5;
    --de-btnSecondaryOutline: #1F242F;
    --de-btnSecondaryOutlineHover: #161B26;
    --de-dropdownBg: #161B26;
    --de-dropdownBgHover: #1F242F;
    --de-dropdownColor: #E6EDE4;
    --de-chartBg: #161B26;
    --de-chartColor: #E6EDE4;
    --de-tooltipBg: #161B26;
    --de-tooltipColor: #E6EDE4;
    --de-cardBg: "transparent";
    --de-controlBg: #161B26;
    --de-controlBgHover: #1F242F;
    --de-controlBgActive: #A7ADA5;
    --de-controlBorder: #1F242F;
    --de-controlHandle: #A7ADA5;
    --de-controlHandleActive: #03111C;
    --de-scrollThumb: #1F242F;
    --de-scrollTrack: #161B26;
    --de-tabBg: "transparent";
    --de-tabBgHover: #161B26;
    --de-tabBgActive: #1F242F;
    --de-modalBackdrop: rgba(0, 0, 0, .6);
    --de-modalBg: #03111C;
    --table-td: #161B26;
    --table-td-hover: #1F242F;
    --table-td-accent: #1F242F
}

.light-mode {
    --de-bodyBg: #FFFFFF;
    --de-accentBg: #F7F8FA;
    --de-bodyColor: #19233C;
    --de-mutedColor: #72798A;
    --de-primary: #AD7A48;
    --de-secondary: #E2E4EB;
    --de-iconColor: #72798A;
    --de-success: #32CD32;
    --de-warning: #DC7941;
    --de-error: #C04563;
    --de-borderColor: #E2E4EB;
    --de-borderLightColor: #E2E4EB;
    --de-btnPrimaryBg: #AD7A48;
    --de-btnPrimaryBgHover: #D2A477;
    --de-btnPrimaryBgDisabled: #DECAB6;
    --de-btnPrimaryTextColor: #FFFFFF;
    --de-btnPrimaryTextColorHover: #FFFFFF;
    --de-btnPrimaryTextColorDisabled: #FFFFFF;
    --de-primaryTagBg: rgba(173, 122, 72, .12);
    --de-btnSecondaryBg: #E2E4EB;
    --de-btnSecondaryBgHover: #E2E4EB;
    --de-btnSecondaryBgDisabled: #F7F8FA;
    --de-btnSecondaryTextColor: #19233C;
    --de-btnSecondaryTextColorHover: #19233C;
    --de-btnSecondaryTextColorDisabled: #19233C;
    --de-btnSecondaryOutline: #E2E4EB;
    --de-btnSecondaryOutlineHover: #E2E4EB;
    --de-dropdownBg: #FFFFFF;
    --de-dropdownBgHover: #E6EDE4;
    --de-dropdownColor: #19233C;
    --de-chartBg: #FFFFFF;
    --de-chartColor: #19233C;
    --de-tooltipBg: #FFFFFF;
    --de-tooltipColor: #19233C;
    --de-cardBg: "transparent";
    --de-controlBg: #F7F8FA;
    --de-controlBgHover: #E2E4EB;
    --de-controlBgActive: #72798A;
    --de-controlBorder: #E2E4EB;
    --de-controlHandle: #72798A;
    --de-controlHandleActive: #F7F8FA;
    --de-scrollThumb: #72798A;
    --de-scrollTrack: #F7F8FA;
    --de-tabBg: "transparent";
    --de-tabBgHover: #F7F8FA;
    --de-tabBgActive: #E2E4EB;
    --de-modalBackdrop: rgba(0, 0, 0, .6);
    --de-modalBg: #FFFFFF;
    --table-td: #F7F8FA;
    --table-td-hover: #E2E4EB;
    --table-td-accent: #E2E4EB
}

@font-face {
    font-family: IBM Plex Mono Regular;
    src: url(IBMPlexMono-Regular.e32fb388acfc5bf9.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

:root {
    --de-fontFamily: "Onest", sans-serif;
    --de-fontFamilyHeading: "Onest", sans-serif;
    --de-fontFamilyMonospace: "IBM Plex Mono Regular", monospace;
    --de-bodyFontSize: 14px;
    --de-bodyFontSizeLg: 16px;
    --de-bodyFontSizeSm: 12px;
    --de-bodyLineHeight: 18px;
    --de-h1FontSize: 24px;
    --de-h2FontSize: 20px;
    --de-h3FontSize: 16px;
    --de-titleFontSize: 20px
}

html {
    font-size: 12px
}

body {
    font-weight: 400
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 500;
    margin: 0 0 .5rem
}

h1, .h1 {
    font-size: var(--de-h1FontSize);
    line-height: 1.3334
}

h2, .h2 {
    font-size: var(--de-h2FontSize);
    line-height: 1.4
}

h3, .h3 {
    font-size: var(--de-h3FontSize);
    line-height: 1.35
}

h4, .h4 {
    font-size: 14px;
    line-height: 1.125
}

.font-lg {
    font-size: var(--de-bodyFontSizeLg) !important;
    line-height: 1.35
}

.font-md {
    font-size: var(--de-bodyFontSize) !important;
    line-height: 1.28
}

.font-sm {
    font-size: var(--de-bodyFontSizeSm) !important;
    line-height: 1.2 !important
}

.font-xs {
    font-size: 10px !important;
    line-height: 12px
}

p {
    margin: 0 0 1rem
}

p:last-child {
    margin: 0
}

strong, b {
    font-weight: 500
}

a {
    color: inherit;
    text-decoration: none
}

.u-as-link u, .text-decoration a, a.text-decoration {
    color: inherit;
    cursor: pointer;
    text-decoration: underline;
    text-decoration-color: var(--de-mutedColor)
}

.link-underline-inside a, .link-underline {
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    border-bottom: 1px solid var(--de-mutedColor)
}

.pseudo-link {
    cursor: pointer;
    color: var(--de-mutedColor)
}

.pseudo-link:hover {
    color: var(--de-bodyColor)
}

.link-underline-dashed-inside a, .link-underline-dashed {
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    border-bottom: 1px dashed var(--de-mutedColor)
}

.icon {
    font-size: 14px;
    line-height: 1
}

::-webkit-scrollbar-track {
    background: var(--de-scroll-thumb)
}

::-webkit-scrollbar-thumb:hover {
    background: #333333
}

.checker-tabs>.mat-mdc-tab-header .mat-mdc-tab {
    flex: 1
}

.checker-tabs .mat-mdc-tab-body-wrapper {
    margin-top: 1rem
}

.dark-mode .logo-gnosis img {
    filter: invert(.6)
}

@font-face {
    font-family: Onest;
    src: url(Onest-Black.1f7f86d6d3399903.ttf) format("truetype");
    font-weight: 900;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-ExtraBold.4f80c77ebf551929.ttf) format("truetype");
    font-weight: 800;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-Bold.fa08e2e68677ee91.ttf) format("truetype");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-SemiBold.c312bc1485dc3ac7.ttf) format("truetype");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-Medium.fc29f3333f87a55f.ttf) format("truetype");
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-Regular.c8a306849aa76776.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-Light.af99f0667303005f.ttf) format("truetype");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: Onest;
    src: url(Onest-ExtraLight.36a5a87cc059ab62.ttf) format("truetype");
    font-weight: 200;
    font-style: normal
}