.header-banner-container .okg-container,.nav-banner-container .okg-container {
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .header-banner-container .okg-container,.nav-banner-container .okg-container {
        padding-left:12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .header-banner-container .okg-container,.nav-banner-container .okg-container {
        padding-left:calc(50% - 480px);
        padding-right: calc(50% - 480px)
    }
}

@media (min-width: 1270px) {
    .header-banner-container .okg-container,.nav-banner-container .okg-container {
        padding-left:calc(50% - 624px);
        padding-right: calc(50% - 624px)
    }
}

.header-banner-container .okg-container .app-box,.nav-banner-container .okg-container .app-box {
    align-items: baseline;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    padding-left: 8px;
    padding-right: 8px;
    position: relative;
    width: 100%;
    word-break: break-word
}

@media (min-width: 768px) {
    .header-banner-container .okg-container .app-box,.nav-banner-container .okg-container .app-box {
        box-sizing:border-box;
        padding-left: 12px;
        padding-right: 12px;
        width: 100%
    }
}

@media (min-width: 1024px) {
    .header-banner-container .okg-container .app-box,.nav-banner-container .okg-container .app-box {
        box-sizing:border-box;
        padding-left: 12px;
        padding-right: 12px;
        width: 100%
    }
}

@media (min-width: 1270px) {
    .header-banner-container .okg-container .app-box,.nav-banner-container .okg-container .app-box {
        box-sizing:border-box;
        padding-left: 12px;
        padding-right: 12px;
        width: 100%
    }
}

.header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    margin-right: 24px;
    text-align: left
}

@media (min-width: 768px) and (min-width:768px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        box-sizing:border-box;
        padding-left: 12px;
        padding-right: 12px;
        width: 83.33333333%
    }
}

@media (min-width: 768px) and (min-width:1024px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        box-sizing:border-box;
        padding-left: 12px;
        padding-right: 12px;
        width: 83.33333333%
    }
}

@media (min-width: 768px) and (min-width:1270px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        box-sizing:border-box;
        padding-left: 12px;
        padding-right: 12px;
        width: 83.33333333%
    }
}

@media (min-width: 1024px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        margin-left:25%;
        text-align: center
    }
}

@media (min-width: 1024px) and (min-width:768px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        margin-left:8.33333333%
    }
}

@media (min-width: 1024px) and (min-width:1024px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        margin-left:8.33333333%
    }
}

@media (min-width: 1024px) and (min-width:1270px) {
    .header-banner-container .okg-container .text-box,.nav-banner-container .okg-container .text-box {
        margin-left:8.33333333%
    }
}

.header-banner-container .okg-container .text-box .banner-href,.nav-banner-container .okg-container .text-box .banner-href {
    color: #000;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    margin-left: 12px;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline
}

.header-banner-container .okg-container .text-box .banner-href.hide-link,.nav-banner-container .okg-container .text-box .banner-href.hide-link {
    display: none
}

.header-banner-container .okg-container .banner-close,.nav-banner-container .okg-container .banner-close {
    color: #000;
    cursor: pointer;
    margin-left: 24px
}

@media (min-width: 768px) {
    .header-banner-container .okg-container .banner-close,.nav-banner-container .okg-container .banner-close {
        margin-left:unset
    }
}

.header-banner-container .okg-container .banner-close .close-icon,.nav-banner-container .okg-container .banner-close .close-icon {
    font-size: 14px
}

body,html {
    background: #fff;
    color: #000;
    margin: 0
}

@media (max-width: 1024px) {
    iframe[name=intercom-banner-frame] {
        display:none!important
    }
}

:root {
    --global-scrollbar-width: 4px;
    --global-scrollbar-height: 6px;
    --global-scrollbar-border-radius: 8px
}

.theme-light,body {
    --global-scrollbar-background: rgba(0,0,0,.26)
}

.theme-dark {
    --global-scrollbar-background: hsla(0,0%,100%,.36)
}

body ::-webkit-scrollbar {
    background-color: initial;
    height: 0;
    width: 4px;
    width: var(--global-scrollbar-width)
}

body ::-webkit-scrollbar-track {
    background-color: initial
}

body ::-webkit-scrollbar-thumb {
    background-color: var(--global-scrollbar-background);
    border-radius: 8px;
    border-radius: var(--global-scrollbar-border-radius)
}

body.theme-dark ::-webkit-scrollbar,body.theme-dark ::-webkit-scrollbar-track {
    background-color: initial
}

body ::-webkit-scrollbar-corner {
    background-color: initial
}

.okx-header-footer-cash-fiat {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-cash-fiat:before {
    content: "\e0cf";
    font-family: ok-f5350cc488
}

.okx-header-footer-wholesale {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-wholesale:before {
    content: "\e0ce";
    font-family: ok-f5350cc488
}

.okx-header-footer-okx-filled {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okx-filled:before {
    content: "\e0cd";
    font-family: ok-f5350cc488
}

.okx-header-footer-star {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-star:before {
    content: "\e0cc";
    font-family: ok-f5350cc488
}

.okx-header-footer-vip {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-vip:before {
    content: "\e0cb";
    font-family: ok-f5350cc488
}

.okx-header-footer-google-play {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-google-play:before {
    content: "\e0ca";
    font-family: ok-f5350cc488
}

.okx-header-footer-extension-filled {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-extension-filled:before {
    content: "\e0c9";
    font-family: ok-f5350cc488
}

.okx-header-footer-apple {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-apple:before {
    content: "\e0c8";
    font-family: ok-f5350cc488
}

.okx-header-footer-android {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-android:before {
    content: "\e0c7";
    font-family: ok-f5350cc488
}

.okx-header-footer-xlayer {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-xlayer:before {
    content: "\e0c3";
    font-family: ok-f5350cc488
}

.okx-header-footer-link {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-link:before {
    content: "\e0a4";
    font-family: ok-f5350cc488
}

.okx-header-footer-github {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-github:before {
    content: "\e035";
    font-family: ok-f5350cc488
}

.okx-header-footer-trading-data {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-data:before {
    content: "\e0c6";
    font-family: ok-f5350cc488
}

.okx-header-footer-web3-faucet {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-faucet:before {
    content: "\e0c5";
    font-family: ok-f5350cc488
}

.okx-header-footer-official-website {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-official-website:before {
    content: "\e0c4";
    font-family: ok-f5350cc488
}

.okx-header-footer-personal-setting {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-personal-setting:before {
    content: "\e0c2";
    font-family: ok-f5350cc488
}

.okx-header-footer-web3 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3:before {
    content: "\e0c1";
    font-family: ok-f5350cc488
}

.okx-header-footer-night-outline {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-night-outline:before {
    content: "\e0c0";
    font-family: ok-f5350cc488
}

.okx-header-footer-night-filled {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-night-filled:before {
    content: "\e0bf";
    font-family: ok-f5350cc488
}

.okx-header-footer-light-outline {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-light-outline:before {
    content: "\e0be";
    font-family: ok-f5350cc488
}

.okx-header-footer-light-filled {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-light-filled:before {
    content: "\e0bd";
    font-family: ok-f5350cc488
}

.okx-header-footer-computer-outline {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-computer-outline:before {
    content: "\e0bc";
    font-family: ok-f5350cc488
}

.okx-header-footer-computer-filled {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-computer-filled:before {
    content: "\e0bb";
    font-family: ok-f5350cc488
}

.okx-header-footer-xbtc {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-xbtc:before {
    content: "\e0ba";
    font-family: ok-f5350cc488
}

.okx-header-footer-question-mark {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-question-mark:before {
    content: "\e0b9";
    font-family: ok-f5350cc488
}

.okx-header-footer-fire-flame {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fire-flame:before {
    content: "\e0b8";
    font-family: ok-f5350cc488
}

.okx-header-footer-leaderboard {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-leaderboard:before {
    content: "\e0b3";
    font-family: ok-f5350cc488
}

.okx-header-footer-pump {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pump:before {
    content: "\e0b4";
    font-family: ok-f5350cc488
}

.okx-header-footer-signal {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-signal:before {
    content: "\e0b6";
    font-family: ok-f5350cc488
}

.okx-header-footer-tracker {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tracker:before {
    content: "\e0b7";
    font-family: ok-f5350cc488
}

.okx-header-footer-perpetual {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-perpetual:before {
    content: "\e0b2";
    font-family: ok-f5350cc488
}

.okx-header-footer-web3-dapp-rankings {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-dapp-rankings:before {
    content: "\e0b1";
    font-family: ok-f5350cc488
}

.okx-header-footer-trading-mmportal {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-mmportal:before {
    content: "\e0b0";
    font-family: ok-f5350cc488
}

.okx-header-footer-user-protection {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user-protection:before {
    content: "\e0af";
    font-family: ok-f5350cc488
}

.okx-header-footer-defi-recognized {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-defi-recognized:before {
    content: "\e0ae";
    font-family: ok-f5350cc488
}

.okx-header-footer-discover {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-discover:before {
    content: "\e0ab";
    font-family: ok-f5350cc488
}

.okx-header-footer-token {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-token:before {
    content: "\e0ac";
    font-family: ok-f5350cc488
}

.okx-header-footer-exchange-rate {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-exchange-rate:before {
    content: "\e0ad";
    font-family: ok-f5350cc488
}

.okx-header-footer-loan-updated {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-loan-updated:before {
    content: "\e0a8";
    font-family: ok-f5350cc488
}

.okx-header-footer-web3-cryptopedia-updated {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-cryptopedia-updated:before {
    content: "\e0a9";
    font-family: ok-f5350cc488
}

.okx-header-footer-referral-updated {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-referral-updated:before {
    content: "\e0aa";
    font-family: ok-f5350cc488
}

.okx-header-footer-bridge-updated {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bridge-updated:before {
    content: "\e0a7";
    font-family: ok-f5350cc488
}

.okx-header-footer-pro-trade {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pro-trade:before {
    content: "\e0a6";
    font-family: ok-f5350cc488
}

.okx-header-footer-search {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-search:before {
    content: "\e0a5";
    font-family: ok-f5350cc488
}

.okx-header-footer-web3-defi {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-defi:before {
    content: "\e0a3";
    font-family: ok-f5350cc488
}

.okx-header-footer-trading-nmp {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-nmp:before {
    content: "\e0a1";
    font-family: ok-f5350cc488
}

.okx-header-footer-fireworks {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fireworks:before {
    content: "\e0a0";
    font-family: ok-f5350cc488
}

.okx-header-footer-futures-copy {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-futures-copy:before {
    content: "\e09f";
    font-family: ok-f5350cc488
}

.okx-header-footer-premarket {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-premarket:before {
    content: "\e09e";
    font-family: ok-f5350cc488
}

.okx-header-footer-user {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user:before {
    content: "\e08a";
    font-family: ok-f5350cc488
}

.okx-header-footer-tips {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tips:before {
    content: "\e09d";
    font-family: ok-f5350cc488
}

.okx-header-footer-testnetbridge {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-testnetbridge:before {
    content: "\e09c";
    font-family: ok-f5350cc488
}

.okx-header-footer-bridge-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bridge-1:before {
    content: "\e008";
    font-family: ok-f5350cc488
}

.okx-header-footer-crypto-gifts {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-crypto-gifts:before {
    content: "\e09b";
    font-family: ok-f5350cc488
}

.okx-header-footer-listing-application {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-listing-application:before {
    content: "\e09a";
    font-family: ok-f5350cc488
}

.okx-header-footer-spot-copy {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-spot-copy:before {
    content: "\e098";
    font-family: ok-f5350cc488
}

.okx-header-footer-trader-recruitment {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trader-recruitment:before {
    content: "\e097";
    font-family: ok-f5350cc488
}

.okx-header-footer-flash-otc {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-flash-otc:before {
    content: "\e096";
    font-family: ok-f5350cc488
}

.okx-header-footer-explorer {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-explorer:before {
    content: "\e095";
    font-family: ok-f5350cc488
}

.okx-header-footer-analysis {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-analysis:before {
    content: "\e000";
    font-family: ok-f5350cc488
}

.okx-header-footer--ecosystem {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer--ecosystem:before {
    content: "\e001";
    font-family: ok-f5350cc488
}

.okx-header-footer-api-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-api-1:before {
    content: "\e002";
    font-family: ok-f5350cc488
}

.okx-header-footer-arrow-chevrons-right {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-chevrons-right:before {
    content: "\e003";
    font-family: ok-f5350cc488
}

.okx-header-footer-arrow-chevrons-up {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-chevrons-up:before {
    content: "\e004";
    font-family: ok-f5350cc488
}

.okx-header-footer-authorization {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-authorization:before {
    content: "\e005";
    font-family: ok-f5350cc488
}

.okx-header-footer-biyong {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-biyong:before {
    content: "\e006";
    font-family: ok-f5350cc488
}

.okx-header-footer-blockchain-explorer {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-blockchain-explorer:before {
    content: "\e007";
    font-family: ok-f5350cc488
}

.okx-header-footer-api {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-api:before {
    content: "\e009";
    font-family: ok-f5350cc488
}

.okx-header-footer-blockdream-ventures-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-blockdream-ventures-1:before {
    content: "\e00a";
    font-family: ok-f5350cc488
}

.okx-header-footer-arbitrage-order {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arbitrage-order:before {
    content: "\e00b";
    font-family: ok-f5350cc488
}

.okx-header-footer-arrow-chevrons-down {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-chevrons-down:before {
    content: "\e00c";
    font-family: ok-f5350cc488
}

.okx-header-footer-copytrading {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copytrading:before {
    content: "\e00d";
    font-family: ok-f5350cc488
}

.okx-header-footer-cryptopedia {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-cryptopedia:before {
    content: "\e00e";
    font-family: ok-f5350cc488
}

.okx-header-footer-create-a-bot {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-create-a-bot:before {
    content: "\e00f";
    font-family: ok-f5350cc488
}

.okx-header-footer-dapp {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dapp:before {
    content: "\e010";
    font-family: ok-f5350cc488
}

.okx-header-footer-bridge {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bridge:before {
    content: "\e011";
    font-family: ok-f5350cc488
}

.okx-header-footer-arrow-pointer-left-sm {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-pointer-left-sm:before {
    content: "\e012";
    font-family: ok-f5350cc488
}

.okx-header-footer-buy-crypto {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-buy-crypto:before {
    content: "\e013";
    font-family: ok-f5350cc488
}

.okx-header-footer-broker {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-broker:before {
    content: "\e014";
    font-family: ok-f5350cc488
}

.okx-header-footer-buy-with-card {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-buy-with-card:before {
    content: "\e015";
    font-family: ok-f5350cc488
}

.okx-header-footer-celue {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-celue:before {
    content: "\e016";
    font-family: ok-f5350cc488
}

.okx-header-footer-center {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-center:before {
    content: "\e017";
    font-family: ok-f5350cc488
}

.okx-header-footer-check {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-check:before {
    content: "\e018";
    font-family: ok-f5350cc488
}

.okx-header-footer-close {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-close:before {
    content: "\e019";
    font-family: ok-f5350cc488
}

.okx-header-footer-cloud {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-cloud:before {
    content: "\e01a";
    font-family: ok-f5350cc488
}

.okx-header-footer-community {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-community:before {
    content: "\e01b";
    font-family: ok-f5350cc488
}

.okx-header-footer-convert-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-convert-1:before {
    content: "\e01c";
    font-family: ok-f5350cc488
}

.okx-header-footer-copiers {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copiers:before {
    content: "\e01d";
    font-family: ok-f5350cc488
}

.okx-header-footer-convert {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-convert:before {
    content: "\e01e";
    font-family: ok-f5350cc488
}

.okx-header-footer-copy-trading {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copy-trading:before {
    content: "\e01f";
    font-family: ok-f5350cc488
}

.okx-header-footer-defi {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-defi:before {
    content: "\e020";
    font-family: ok-f5350cc488
}

.okx-header-footer-demo-trading-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-demo-trading-1:before {
    content: "\e021";
    font-family: ok-f5350cc488
}

.okx-header-footer-demo-trading {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-demo-trading:before {
    content: "\e022";
    font-family: ok-f5350cc488
}

.okx-header-footer-deposit {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-deposit:before {
    content: "\e023";
    font-family: ok-f5350cc488
}

.okx-header-footer-developers {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-developers:before {
    content: "\e024";
    font-family: ok-f5350cc488
}

.okx-header-footer-dialogue {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dialogue:before {
    content: "\e025";
    font-family: ok-f5350cc488
}

.okx-header-footer-discord {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-discord:before {
    content: "\e026";
    font-family: ok-f5350cc488
}

.okx-header-footer-doc {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-doc:before {
    content: "\e027";
    font-family: ok-f5350cc488
}

.okx-header-footer-dot {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dot:before {
    content: "\e028";
    font-family: ok-f5350cc488
}

.okx-header-footer-download {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-download:before {
    content: "\e029";
    font-family: ok-f5350cc488
}

.okx-header-footer-earn {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-earn:before {
    content: "\e02a";
    font-family: ok-f5350cc488
}

.okx-header-footer-event {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-event:before {
    content: "\e02b";
    font-family: ok-f5350cc488
}

.okx-header-footer-ecosystem {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-ecosystem:before {
    content: "\e02c";
    font-family: ok-f5350cc488
}

.okx-header-footer-exclamation {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-exclamation:before {
    content: "\e02d";
    font-family: ok-f5350cc488
}

.okx-header-footer-faucet {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-faucet:before {
    content: "\e02e";
    font-family: ok-f5350cc488
}

.okx-header-footer-facebook {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-facebook:before {
    content: "\e02f";
    font-family: ok-f5350cc488
}

.okx-header-footer-fees {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fees:before {
    content: "\e030";
    font-family: ok-f5350cc488
}

.okx-header-footer-fixed-loan {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fixed-loan:before {
    content: "\e031";
    font-family: ok-f5350cc488
}

.okx-header-footer-futures {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-futures:before {
    content: "\e032";
    font-family: ok-f5350cc488
}

.okx-header-footer-galex {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-galex:before {
    content: "\e033";
    font-family: ok-f5350cc488
}

.okx-header-footer-gasback {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-gasback:before {
    content: "\e034";
    font-family: ok-f5350cc488
}

.okx-header-footer-gift {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-gift:before {
    content: "\e036";
    font-family: ok-f5350cc488
}

.okx-header-footer-language-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-language-1:before {
    content: "\e037";
    font-family: ok-f5350cc488
}

.okx-header-footer-join-group {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-join-group:before {
    content: "\e038";
    font-family: ok-f5350cc488
}

.okx-header-footer-hamburger {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-hamburger:before {
    content: "\e03b";
    font-family: ok-f5350cc488
}

.okx-header-footer-line {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-line:before {
    content: "\e03c";
    font-family: ok-f5350cc488
}

.okx-header-footer-linkedin {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-linkedin:before {
    content: "\e03d";
    font-family: ok-f5350cc488
}

.okx-header-footer-loan {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-loan:before {
    content: "\e03e";
    font-family: ok-f5350cc488
}

.okx-header-footer-historical-market-data {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-historical-market-data:before {
    content: "\e03f";
    font-family: ok-f5350cc488
}

.okx-header-footer-managed-trading-sub-accounts {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-managed-trading-sub-accounts:before {
    content: "\e040";
    font-family: ok-f5350cc488
}

.okx-header-footer-home-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-home-1:before {
    content: "\e041";
    font-family: ok-f5350cc488
}

.okx-header-footer-help-center {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-help-center:before {
    content: "\e042";
    font-family: ok-f5350cc488
}

.okx-header-footer-marketplace {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-marketplace:before {
    content: "\e043";
    font-family: ok-f5350cc488
}

.okx-header-footer-home {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-home:before {
    content: "\e044";
    font-family: ok-f5350cc488
}

.okx-header-footer-hot {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-hot:before {
    content: "\e045";
    font-family: ok-f5350cc488
}

.okx-header-footer-nitro-spreads {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-nitro-spreads:before {
    content: "\e046";
    font-family: ok-f5350cc488
}

.okx-header-footer-node {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-node:before {
    content: "\e047";
    font-family: ok-f5350cc488
}

.okx-header-footer-notice {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-notice:before {
    content: "\e048";
    font-family: ok-f5350cc488
}

.okx-header-footer-okb {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okb:before {
    content: "\e049";
    font-family: ok-f5350cc488
}

.okx-header-footer-okc {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okc:before {
    content: "\e04a";
    font-family: ok-f5350cc488
}

.okx-header-footer-oklink-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-oklink-1:before {
    content: "\e04b";
    font-family: ok-f5350cc488
}

.okx-header-footer-oklink {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-oklink:before {
    content: "\e04c";
    font-family: ok-f5350cc488
}

.okx-header-footer-okx {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okx:before {
    content: "\e04d";
    font-family: ok-f5350cc488
}

.okx-header-footer-overview {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-overview:before {
    content: "\e04e";
    font-family: ok-f5350cc488
}

.okx-header-footer-opptunities {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-opptunities:before {
    content: "\e04f";
    font-family: ok-f5350cc488
}

.okx-header-footer-p2p-trading {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-p2p-trading:before {
    content: "\e050";
    font-family: ok-f5350cc488
}

.okx-header-footer-payment-settings {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-payment-settings:before {
    content: "\e051";
    font-family: ok-f5350cc488
}

.okx-header-footer-perp {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-perp:before {
    content: "\e052";
    font-family: ok-f5350cc488
}

.okx-header-footer-pool {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pool:before {
    content: "\e053";
    font-family: ok-f5350cc488
}

.okx-header-footer-ibc {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-ibc:before {
    content: "\e054";
    font-family: ok-f5350cc488
}

.okx-header-footer-press-room {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-press-room:before {
    content: "\e055";
    font-family: ok-f5350cc488
}

.okx-header-footer-hot-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-hot-1:before {
    content: "\e056";
    font-family: ok-f5350cc488
}

.okx-header-footer-id-card {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-id-card:before {
    content: "\e057";
    font-family: ok-f5350cc488
}

.okx-header-footer-information {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-information:before {
    content: "\e058";
    font-family: ok-f5350cc488
}

.okx-header-footer-info {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-info:before {
    content: "\e059";
    font-family: ok-f5350cc488
}

.okx-header-footer-instagram {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-instagram:before {
    content: "\e05a";
    font-family: ok-f5350cc488
}

.okx-header-footer-question {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-question:before {
    content: "\e05b";
    font-family: ok-f5350cc488
}

.okx-header-footer-proof-of-reservation {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-proof-of-reservation:before {
    content: "\e05c";
    font-family: ok-f5350cc488
}

.okx-header-footer-questn {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-questn:before {
    content: "\e05d";
    font-family: ok-f5350cc488
}

.okx-header-footer-institutions-home {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-institutions-home:before {
    content: "\e05e";
    font-family: ok-f5350cc488
}

.okx-header-footer-jumpstart {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-jumpstart:before {
    content: "\e05f";
    font-family: ok-f5350cc488
}

.okx-header-footer-rewards {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-rewards:before {
    content: "\e060";
    font-family: ok-f5350cc488
}

.okx-header-footer-language {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-language:before {
    content: "\e061";
    font-family: ok-f5350cc488
}

.okx-header-footer-learn {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-learn:before {
    content: "\e062";
    font-family: ok-f5350cc488
}

.okx-header-footer-logout {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-logout:before {
    content: "\e063";
    font-family: ok-f5350cc488
}

.okx-header-footer-margin-trading {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-margin-trading:before {
    content: "\e064";
    font-family: ok-f5350cc488
}

.okx-header-footer-marketing {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-marketing:before {
    content: "\e065";
    font-family: ok-f5350cc488
}

.okx-header-footer-more {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-more:before {
    content: "\e066";
    font-family: ok-f5350cc488
}

.okx-header-footer-nft {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-nft:before {
    content: "\e067";
    font-family: ok-f5350cc488
}

.okx-header-footer-reddit {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-reddit:before {
    content: "\e068";
    font-family: ok-f5350cc488
}

.okx-header-footer-records {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-records:before {
    content: "\e069";
    font-family: ok-f5350cc488
}

.okx-header-footer-referral {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-referral:before {
    content: "\e06a";
    font-family: ok-f5350cc488
}

.okx-header-footer-report-centre {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-report-centre:before {
    content: "\e06b";
    font-family: ok-f5350cc488
}

.okx-header-footer-rfq {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-rfq:before {
    content: "\e06c";
    font-family: ok-f5350cc488
}

.okx-header-footer-safe {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-safe:before {
    content: "\e06d";
    font-family: ok-f5350cc488
}

.okx-header-footer-security-of-funds {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-security-of-funds:before {
    content: "\e06e";
    font-family: ok-f5350cc488
}

.okx-header-footer-security-settings {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-security-settings:before {
    content: "\e06f";
    font-family: ok-f5350cc488
}

.okx-header-footer-signout {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-signout:before {
    content: "\e070";
    font-family: ok-f5350cc488
}

.okx-header-footer-spot-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-spot-1:before {
    content: "\e071";
    font-family: ok-f5350cc488
}

.okx-header-footer-spot {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-spot:before {
    content: "\e072";
    font-family: ok-f5350cc488
}

.okx-header-footer-stake {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-stake:before {
    content: "\e073";
    font-family: ok-f5350cc488
}

.okx-header-footer-start-demo-trading {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-start-demo-trading:before {
    content: "\e074";
    font-family: ok-f5350cc488
}

.okx-header-footer-status {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-status:before {
    content: "\e075";
    font-family: ok-f5350cc488
}

.okx-header-footer-setting {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-setting:before {
    content: "\e076";
    font-family: ok-f5350cc488
}

.okx-header-footer-swap {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-swap:before {
    content: "\e077";
    font-family: ok-f5350cc488
}

.okx-header-footer-support {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-support:before {
    content: "\e078";
    font-family: ok-f5350cc488
}

.okx-header-footer-subgraph {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-subgraph:before {
    content: "\e079";
    font-family: ok-f5350cc488
}

.okx-header-footer-testnet {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-testnet:before {
    content: "\e07a";
    font-family: ok-f5350cc488
}

.okx-header-footer-telegram {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-telegram:before {
    content: "\e07b";
    font-family: ok-f5350cc488
}

.okx-header-footer-sub-account {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-sub-account:before {
    content: "\e07c";
    font-family: ok-f5350cc488
}

.okx-header-footer-trade-perp {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trade-perp:before {
    content: "\e07d";
    font-family: ok-f5350cc488
}

.okx-header-footer-tiktok {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tiktok:before {
    content: "\e07e";
    font-family: ok-f5350cc488
}

.okx-header-footer-third-party-payment,.okx-header-footer-trade-swap {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trade-swap:before {
    content: "\e080";
    font-family: ok-f5350cc488
}

.okx-header-footer-x1swap {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-x1swap:before {
    content: "\e081";
    font-family: ok-f5350cc488
}

.okx-header-footer-tradingview {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tradingview:before {
    content: "\e082";
    font-family: ok-f5350cc488
}

.okx-header-footer-trading-view {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-view:before {
    content: "\e083";
    font-family: ok-f5350cc488
}

.okx-header-footer-transfer {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-transfer:before {
    content: "\e084";
    font-family: ok-f5350cc488
}

.okx-header-footer-twitter-1 {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-twitter-1:before {
    content: "\e085";
    font-family: ok-f5350cc488
}

.okx-header-footer-twitter {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-twitter:before {
    content: "\e086";
    font-family: ok-f5350cc488
}

.okx-header-footer-trading-bot {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-bot:before {
    content: "\e087";
    font-family: ok-f5350cc488
}

.okx-header-footer-user-community {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user-community:before {
    content: "\e088";
    font-family: ok-f5350cc488
}

.okx-header-footer-transactions {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-transactions:before {
    content: "\e089";
    font-family: ok-f5350cc488
}

.okx-header-footer-user-home {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user-home:before {
    content: "\e08b";
    font-family: ok-f5350cc488
}

.okx-header-footer-try-fiat {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-try-fiat:before {
    content: "\e08c";
    font-family: ok-f5350cc488
}

.okx-header-footer-verification {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-verification:before {
    content: "\e08d";
    font-family: ok-f5350cc488
}

.okx-header-footer-vip-loan {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-vip-loan:before {
    content: "\e08e";
    font-family: ok-f5350cc488
}

.okx-header-footer-vk {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-vk:before {
    content: "\e08f";
    font-family: ok-f5350cc488
}

.okx-header-footer-withdraw {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-withdraw:before {
    content: "\e090";
    font-family: ok-f5350cc488
}

.okx-header-footer-weibo {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-weibo:before {
    content: "\e091";
    font-family: ok-f5350cc488
}

.okx-header-footer-youtube {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-youtube:before {
    content: "\e092";
    font-family: ok-f5350cc488
}

.okx-header-footer-wallet {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-wallet:before {
    content: "\e093";
    font-family: ok-f5350cc488
}

.okx-header-footer-warning {
    --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-warning:before {
    content: "\e094";
    font-family: ok-f5350cc488
}

.iconfont {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 16px;
    font-style: normal
}

.iconfont:before {
    display: inline-block
}

@font-face {
    font-display: block;
    font-family: ok-f5350cc488;
    font-style: normal;
    src: url(../24b7a95c44356cce0934.woff2) format("woff2")
}

[dir=rtl] .okx-header-footer-arrow-chevrons-right:before,[dir=rtl] .okx-header-footer-arrow-pointer-left-sm:before,[dir=rtl] .okx-header-footer-center:before,[dir=rtl] .okx-header-footer-dialogue:before,[dir=rtl] .okx-header-footer-question:before,[dir=rtl] .okx-header-footer-report-centre:before {
    transform: scaleX(-1)
}

:root {
    --oxnv-okd-color-gray-050: #f9f9f9;
    --oxnv-okd-color-gray-100: #ebebeb;
    --oxnv-okd-color-gray-200: #dbdbdb;
    --oxnv-okd-color-gray-300: #bdbdbd;
    --oxnv-okd-color-gray-400: #929292;
    --oxnv-okd-color-gray-500: #6e6e6e;
    --oxnv-okd-color-gray-600: #545454;
    --oxnv-okd-color-gray-700: #3d3d3d;
    --oxnv-okd-color-gray-800: #1a1a1a;
    --oxnv-okd-color-gray-900: #000;
    --oxnv-okd-color-blue-050: #f5f9ff;
    --oxnv-okd-color-blue-100: #d1e3ff;
    --oxnv-okd-color-blue-200: #afcfff;
    --oxnv-okd-color-blue-300: #8dbbff;
    --oxnv-okd-color-blue-400: #6ba6ff;
    --oxnv-okd-color-blue-500: #4992ff;
    --oxnv-okd-color-blue-600: #277dff;
    --oxnv-okd-color-blue-700: #0569ff;
    --oxnv-okd-color-blue-800: #005eea;
    --oxnv-okd-color-blue-900: #0051ca;
    --oxnv-okd-color-green-050: #f2fff7;
    --oxnv-okd-color-green-100: #d2f4de;
    --oxnv-okd-color-green-200: #a5e9be;
    --oxnv-okd-color-green-300: #78de9d;
    --oxnv-okd-color-green-400: #4bd37d;
    --oxnv-okd-color-green-500: #31bd65;
    --oxnv-okd-color-green-600: #18a04a;
    --oxnv-okd-color-green-700: #127837;
    --oxnv-okd-color-green-800: #0c5025;
    --oxnv-okd-color-green-900: #0c5025;
    --oxnv-okd-color-red-050: #fff8f9;
    --oxnv-okd-color-red-100: #fcdce5;
    --oxnv-okd-color-red-200: #f9b9ca;
    --oxnv-okd-color-red-300: #f796b0;
    --oxnv-okd-color-red-400: #f07596;
    --oxnv-okd-color-red-500: #f1507b;
    --oxnv-okd-color-red-600: #c14062;
    --oxnv-okd-color-red-700: #91304a;
    --oxnv-okd-color-red-800: #602031;
    --oxnv-okd-color-red-900: #301019;
    --oxnv-okd-color-orange-050: #fef9f6;
    --oxnv-okd-color-orange-100: #fce3d4;
    --oxnv-okd-color-orange-200: #fbceb4;
    --oxnv-okd-color-orange-300: #f9b994;
    --oxnv-okd-color-orange-400: #f7a474;
    --oxnv-okd-color-orange-500: #f58f54;
    --oxnv-okd-color-orange-600: #f6813d;
    --oxnv-okd-color-orange-700: #f16514;
    --oxnv-okd-color-orange-800: #e96010;
    --oxnv-okd-color-orange-900: #bf4803;
    --oxnv-okd-color-yellow-050: #fffcf5;
    --oxnv-okd-color-yellow-100: #fff2d1;
    --oxnv-okd-color-yellow-200: #ffe9af;
    --oxnv-okd-color-yellow-300: #ffdf8d;
    --oxnv-okd-color-yellow-400: #ffd66b;
    --oxnv-okd-color-yellow-500: #ffcc49;
    --oxnv-okd-color-yellow-600: #ffc327;
    --oxnv-okd-color-yellow-700: #ffb905;
    --oxnv-okd-color-yellow-800: #eaa900;
    --oxnv-okd-color-yellow-900: #d29801;
    --oxnv-okd-color-text-white: #fff;
    --oxnv-okd-color-text-black: #1f2933;
    --oxnv-okd-color-background-1: #fff;
    --oxnv-okd-color-background-2: #f7f7f7;
    --oxnv-okd-color-transparent: transparent;
    --oxnv-okd-color-white: #fff;
    --oxnv-okd-color-black: #000;
    --oxnv-okd-color-line-muted: #ebebeb;
    --oxnv-okd-color-line-secondary: #dbdbdb;
    --oxnv-okd-color-line-amplifed: #bdbdbd;
    --oxnv-okd-color-text-lighter: #bdbdbd;
    --oxnv-okd-color-text-light: #929292;
    --oxnv-okd-color-text-secondary: #3d3d3d;
    --oxnv-okd-color-text-amplifed: #000;
    --oxnv-okd-color-background-3: #f2f2f2;
    --oxnv-okd-color-fq-blue-lv1: #0569ff;
    --oxnv-okd-color-fq-green-lv1: #19cc5b;
    --oxnv-okd-color-fq-red-lv1: #f1507b;
    --oxnv-okd-color-fq-orange-lv1: #f16514;
    --oxnv-okd-color-fq-blue-lv2: #0569ff;
    --oxnv-okd-color-background-hover: #ebebeb;
    --oxnv-okd-color-prefer-red-chart: #f1507b;
    --oxnv-okd-color-prefer-red-bg: #eb4b6d;
    --oxnv-okd-color-prefer-green-chart: #19cc5b;
    --oxnv-okd-color-prefer-green-bg: #31bd65;
    --oxnv-okd-color-prefer-red-text: #eb4b6d;
    --oxnv-okd-color-prefer-green-text: #31bd65;
    --oxnv-okd-color-branded-primary: #bcff2f;
    --oxnv-okd-color-fq-critical: #eb4b6d;
    --oxnv-okd-color-fq-warning: #f16514;
    --oxnv-okd-color-fq-positive: #31bd65;
    --oxnv-okd-color-fq-neutral: #000;
    --oxnv-okd-color-fq-accent: #0569ff;
    --oxnv-okd-color-prefer-neutral-text: #929292;
    --oxnv-okd-color-prefer-neutral-bg: #929292;
    --oxnv-okd-color-white-opacity-5: #fff;
    --oxnv-okd-color-white-opacity-10: hsla(0,0%,100%,.94);
    --oxnv-okd-color-white-opacity-20: hsla(0,0%,100%,.88);
    --oxnv-okd-color-white-opacity-30: hsla(0,0%,100%,.78);
    --oxnv-okd-color-white-opacity-40: hsla(0,0%,100%,.76);
    --oxnv-okd-color-white-opacity-50: hsla(0,0%,100%,.54);
    --oxnv-okd-color-white-opacity-60: hsla(0,0%,100%,.36);
    --oxnv-okd-color-white-opacity-70: hsla(0,0%,100%,.19);
    --oxnv-okd-color-white-opacity-80: hsla(0,0%,100%,.12);
    --oxnv-okd-color-white-opacity-90: hsla(0,0%,100%,.06);
    --oxnv-okd-color-black-opacity-5: #000;
    --oxnv-okd-color-black-opacity-10: rgba(0,0,0,.9);
    --oxnv-okd-color-black-opacity-20: rgba(0,0,0,.76);
    --oxnv-okd-color-black-opacity-30: rgba(0,0,0,.68);
    --oxnv-okd-color-black-opacity-40: rgba(0,0,0,.57);
    --oxnv-okd-color-black-opacity-50: rgba(0,0,0,.43);
    --oxnv-okd-color-black-opacity-60: rgba(0,0,0,.26);
    --oxnv-okd-color-black-opacity-70: rgba(0,0,0,.14);
    --oxnv-okd-color-black-opacity-80: rgba(0,9,3,.08);
    --oxnv-okd-color-black-opacity-90: rgba(0,0,0,.04);
    --oxnv-okd-color-neutral-5: #fff;
    --oxnv-okd-color-neutral-10: #fafafa;
    --oxnv-okd-color-neutral-20: #f3f3f3;
    --oxnv-okd-color-neutral-30: #e6e6e6;
    --oxnv-okd-color-neutral-40: #d9d9d9;
    --oxnv-okd-color-neutral-50: #c7c7c7;
    --oxnv-okd-color-neutral-60: #b3b3b3;
    --oxnv-okd-color-neutral-70: #a7a7a7;
    --oxnv-okd-color-neutral-80: #999;
    --oxnv-okd-color-neutral-90: #909090;
    --oxnv-okd-color-neutral-100: grey;
    --oxnv-okd-color-neutral-110: #757575;
    --oxnv-okd-color-neutral-120: #666;
    --oxnv-okd-color-neutral-130: #5b5b5b;
    --oxnv-okd-color-neutral-140: #4d4d4d;
    --oxnv-okd-color-neutral-150: #414141;
    --oxnv-okd-color-neutral-160: #383838;
    --oxnv-okd-color-neutral-170: #272727;
    --oxnv-okd-color-neutral-180: #1d1d1d;
    --oxnv-okd-color-neutral-190: #0e0e0e;
    --oxnv-okd-color-neutral-200: #000;
    --oxnv-okd-color-tangerine-5: #ffedcb;
    --oxnv-okd-color-tangerine-10: #ffd37d;
    --oxnv-okd-color-tangerine-30: #ffb117;
    --oxnv-okd-color-tangerine-40: #db8f00;
    --oxnv-okd-color-tangerine-50: #a06900;
    --oxnv-okd-color-tangerine-60: #664300;
    --oxnv-okd-color-lemon-5: #fffdc4;
    --oxnv-okd-color-lemon-10: #fffa7a;
    --oxnv-okd-color-lemon-20: #fff500;
    --oxnv-okd-color-lemon-30: #e5dd00;
    --oxnv-okd-color-lemon-40: #b2ab00;
    --oxnv-okd-color-lemon-50: #797400;
    --oxnv-okd-color-lemon-60: #5c5800;
    --oxnv-okd-color-tangerine-20: #ffc452;
    --oxnv-okd-color-neonlime-5: #e6ffb0;
    --oxnv-okd-color-neonlime-10: #d5ff7d;
    --oxnv-okd-color-neonlime-20: #bcff2f;
    --oxnv-okd-color-neonlime-30: #9fe212;
    --oxnv-okd-color-neonlime-40: #8ec51d;
    --oxnv-okd-color-neonlime-50: #568000;
    --oxnv-okd-color-neonlime-60: #3d5c00;
    --oxnv-okd-color-neonmint-5: #cbffe0;
    --oxnv-okd-color-neonmint-10: #7dffb1;
    --oxnv-okd-color-neonmint-20: #24ff7b;
    --oxnv-okd-color-neonmint-30: #12e366;
    --oxnv-okd-color-neonmint-40: #00bc4b;
    --oxnv-okd-color-neonmint-50: #008535;
    --oxnv-okd-color-neonmint-60: #005c25;
    --oxnv-okd-color-bluebell-5: #e6eaff;
    --oxnv-okd-color-bluebell-10: #b8bfff;
    --oxnv-okd-color-bluebell-20: #8a91ff;
    --oxnv-okd-color-bluebell-30: #5f62ff;
    --oxnv-okd-color-bluebell-40: #5043ff;
    --oxnv-okd-color-bluebell-50: #4c2fff;
    --oxnv-okd-color-bluebell-60: #1d00d4;
    --oxnv-okd-color-lavender-5: #f2e8ff;
    --oxnv-okd-color-lavender-10: #dbbfff;
    --oxnv-okd-color-lavender-20: #c496ff;
    --oxnv-okd-color-lavender-30: #ac6cff;
    --oxnv-okd-color-lavender-40: #9543ff;
    --oxnv-okd-color-lavender-50: #7e1aff;
    --oxnv-okd-color-lavender-60: #5600c5;
    --oxnv-okd-color-orchid-5: #fee7ea;
    --oxnv-okd-color-orchid-10: #ffc1c9;
    --oxnv-okd-color-orchid-20: #ffa8b3;
    --oxnv-okd-color-orchid-30: #ff7888;
    --oxnv-okd-color-orchid-40: #f5384f;
    --oxnv-okd-color-orchid-50: #cd2438;
    --oxnv-okd-color-orchid-60: #9a1b2a;
    --oxnv-okd-color-semantic-positive-1: #31bd65;
    --oxnv-okd-color-semantic-negative-1: #eb4b6d;
    --oxnv-okd-color-transparent-base-black: transparent;
    --oxnv-okd-color-transparent-base-white: transparent;
    --oxnv-okd-color-alert-base-info: #f7f7f7;
    --oxnv-okd-color-alert-base-success: #eaf8f0;
    --oxnv-okd-color-alert-base-warning: #fef9f6;
    --oxnv-okd-color-alert-base-error: #fdedf0;
    --oxnv-okd-color-basil-5: #e9f4d1;
    --oxnv-okd-color-basil-10: #d2e8a4;
    --oxnv-okd-color-basil-20: #81be00;
    --oxnv-okd-color-basil-30: #49a92d;
    --oxnv-okd-color-basil-40: #2b6d17;
    --oxnv-okd-color-basil-50: #1a410e;
    --oxnv-okd-color-basil-60: #1a2600;
    --oxnv-okd-color-rose-5: #ffdfe9;
    --oxnv-okd-color-rose-10: #ffc0d3;
    --oxnv-okd-color-rose-20: #ff5eb6;
    --oxnv-okd-color-rose-30: #fc46ab;
    --oxnv-okd-color-rose-40: #a54162;
    --oxnv-okd-color-rose-50: #532131;
    --oxnv-okd-color-rose-60: #2a111f;
    --oxnv-okd-color-neutral-15: #f6f6f6;
    --oxnv-okd-color-neutral-185: #121212;
    --oxnv-okd-color-background-base-primary: #fff;
    --oxnv-okd-color-background-base-secondary: #fafafa;
    --oxnv-okd-color-background-surface-primary: #f3f3f3;
    --oxnv-okd-color-background-surface-secondary: #f6f6f6;
    --oxnv-okd-color-background-surface-pressed: #d9d9d9;
    --oxnv-okd-color-background-surface-disable: #fafafa;
    --oxnv-okd-color-background-scrim: rgba(0,0,0,.43);
    --oxnv-okd-color-container-primary: #fff;
    --oxnv-okd-color-container-secondary: #fafafa;
    --oxnv-okd-color-container-tertiary: #fff;
    --oxnv-okd-color-container-contrast: #414141;
    --oxnv-okd-color-container-inverse: #0e0e0e;
    --oxnv-okd-color-content-primary: #000;
    --oxnv-okd-color-content-secondary: #383838;
    --oxnv-okd-color-content-tertiary: #5b5b5b;
    --oxnv-okd-color-content-contrast: #909090;
    --oxnv-okd-color-content-disabled: #b3b3b3;
    --oxnv-okd-color-content-inverse: #fff;
    --oxnv-okd-color-border-primary: #e6e6e6;
    --oxnv-okd-color-border-secondary: #b3b3b3;
    --oxnv-okd-color-border-contrast: #fafafa;
    --oxnv-okd-color-border-selected: #000;
    --oxnv-okd-color-semantic-neutral: #000;
    --oxnv-okd-color-semantic-notice: #ffb117;
    --oxnv-okd-color-semantic-positive: #31bd65;
    --oxnv-okd-color-semantic-negative: #eb4b6d;
    --oxnv-okd-color-semantic-informative: #8a91ff;
    --oxnv-okd-color-semantic-highlight: #bcff2f;
    --oxnv-okd-color-dvp-neutral: rgba(0,0,0,.57);
    --oxnv-okd-color-dvp-profit: #00bc4b;
    --oxnv-okd-color-dvp-loss: #f5384f;
    --oxnv-okd-color-categorical-01: #8a91ff;
    --oxnv-okd-color-categorical-02: #ffb117;
    --oxnv-okd-color-categorical-03: #bcff2f;
    --oxnv-okd-color-categorical-04: #12e366;
    --oxnv-okd-color-categorical-05: #ff7888;
    --oxnv-okd-color-common-transparent: hsla(0,0%,100%,0);
    --oxnv-okd-color-transparent-black: transparent;
    --oxnv-okd-color-transparent-white: transparent;
    --oxnv-okd-color-alert-info: #f7f7f7;
    --oxnv-okd-color-alert-success: #eaf8f0;
    --oxnv-okd-color-alert-warning: #fef9f6;
    --oxnv-okd-color-alert-error: #fdedf0;
    --oxnv-okd-color-common-background-2: #f3f3f3;
    --oxnv-okd-color-data-visualization-category-01: #8a91ff;
    --oxnv-okd-color-data-visualization-category-02: #ffb117;
    --oxnv-okd-color-data-visualization-category-03: #bcff2f;
    --oxnv-okd-color-data-visualization-category-04: #12e366;
    --oxnv-okd-color-data-visualization-category-05: #ff7888;
    --oxnv-okd-color-preference-loss: #f5384f;
    --oxnv-okd-color-preference-profit: #00bc4b;
    --oxnv-okd-color-preference-neutral: rgba(0,0,0,.57);
    --oxnv-okd-color-border-focus: #000;
    --oxnv-okd-color-background-base-primaryAlternative: #fff;
    --oxnv-okd-color-link-content: #4c2fff;
    --oxnv-okd-color-link-accent-content-primary: #2b6d17;
    --oxnv-okd-color-background-surface-contrast: #fff;
    --oxnv-okd-color-background-surface-brand: #000;
    --oxnv-okd-color-border-tertiary: #f3f3f3;
    --oxnv-okd-color-content-brand: #000;
    --oxnv-okd-color-modal-primary: #fff;
    --oxnv-okd-color-modal-secondary: #fff;
    --oxnv-okd-color-modal-tertiary: #fff;
    --oxnv-okd-color-modal-contrast: #4d4d4d;
    --oxnv-okd-color-card-primary: #f6f6f6;
    --oxnv-okd-color-card-secondary: #f6f6f6;
    --oxnv-okd-color-brand-primary: #2b6d17;
    --oxnv-okd-color-brand-primary-alternative: #2b6d17;
    --oxnv-okd-color-brand-secondary: #8ec51d;
    --oxnv-okd-color-brand-tertiary: #bcff2f;
    --oxnv-okd-color-brand-content: #e6ffb0;
    --oxnv-okd-color-brand-content-contrast: #e6ffb0;
    --oxnv-okd-font-size-base: 16px;
    --oxnv-okd-font-size-md: 14px;
    --oxnv-okd-font-size-xs: 12px;
    --oxnv-okd-line-height-base: 20px;
    --oxnv-okd-line-height-md: 20px;
    --oxnv-okd-line-height-xs: 16px;
    --oxnv-okd-shadow-none: 0 0 0 0 transparent;
    --oxnv-okd-shadow-xs: 0 0 0 1px #0000000d;
    --oxnv-okd-shadow-sm: 0 1px 2px 0 #0000000d;
    --oxnv-okd-shadow-default: 0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;
    --oxnv-okd-shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;
    --oxnv-okd-shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;
    --oxnv-okd-shadow-xl: 0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;
    --oxnv-okd-shadow-2xl: 0 25px 50px -12px #00000040;
    --oxnv-okd-border-radius-none: 0;
    --oxnv-okd-border-radius-sm: 2px;
    --oxnv-okd-border-radius-md: 4px;
    --oxnv-okd-border-radius-lg: 6px;
    --oxnv-okd-border-radius-xl: 8px;
    --oxnv-okd-border-radius-xxl: 10px;
    --oxnv-okd-border-radius-xxxl: 12px;
    --oxnv-okd-font-family: HarmonyOS Sans,SF Pro Text,SF Pro Icons,Arial,Helvetica Neue,Helvetica,sans-serif;
    --oxnv-okd-text-display-lg-font-size: 56px;
    --oxnv-okd-text-display-lg-font-weight: 500;
    --oxnv-okd-text-display-lg-line-height: 1.32;
    --oxnv-okd-text-display-md-font-size: 40px;
    --oxnv-okd-text-display-md-font-weight: 500;
    --oxnv-okd-text-display-md-line-height: 52px;
    --oxnv-okd-text-display-sm-font-size: 40px;
    --oxnv-okd-text-display-sm-font-weight: 500;
    --oxnv-okd-text-display-sm-line-height: 52px;
    --oxnv-okd-text-heading-lg-font-size: 30px;
    --oxnv-okd-text-heading-lg-font-weight: 500;
    --oxnv-okd-text-heading-lg-line-height: 40px;
    --oxnv-okd-text-heading-md-font-size: 24px;
    --oxnv-okd-text-heading-md-font-weight: 500;
    --oxnv-okd-text-heading-md-line-height: 30px;
    --oxnv-okd-text-heading-sm-font-size: 18px;
    --oxnv-okd-text-heading-sm-font-weight: 500;
    --oxnv-okd-text-heading-sm-line-height: 24px;
    --oxnv-okd-text-heading-xl-font-size: 36px;
    --oxnv-okd-text-heading-xl-line-height: 1.32;
    --oxnv-okd-text-heading-xl-font-weight: 600;
    --oxnv-okd-text-heading-xxl-font-size: 40px;
    --oxnv-okd-text-heading-xxl-line-height: 1.32;
    --oxnv-okd-text-heading-xxl-font-weight: 600;
    --oxnv-okd-text-heading-overline-font-size: 12px;
    --oxnv-okd-text-heading-overline-line-height: 15px;
    --oxnv-okd-text-heading-overline-font-weight: 500;
    --oxnv-okd-text-body-sm-regular-font-size: 14px;
    --oxnv-okd-text-body-sm-regular-font-weight: 400;
    --oxnv-okd-text-body-sm-regular-line-height: 21px;
    --oxnv-okd-text-body-sm-bold-font-size: 14px;
    --oxnv-okd-text-body-sm-bold-font-weight: 500;
    --oxnv-okd-text-body-sm-bold-line-height: 21px;
    --oxnv-okd-text-body-md-regular-font-size: 16px;
    --oxnv-okd-text-body-md-regular-font-weight: 400;
    --oxnv-okd-text-body-md-regular-line-height: 24px;
    --oxnv-okd-text-body-md-bold-font-size: 16px;
    --oxnv-okd-text-body-md-bold-font-weight: 500;
    --oxnv-okd-text-body-md-bold-line-height: 24px;
    --oxnv-okd-text-body-xs-regular-font-size: 12px;
    --oxnv-okd-text-body-xs-regular-font-weight: 400;
    --oxnv-okd-text-body-xs-regular-line-height: 18px;
    --oxnv-okd-text-body-xs-bold-font-size: 12px;
    --oxnv-okd-text-body-xs-bold-font-weight: 500;
    --oxnv-okd-text-body-xs-bold-line-height: 18px;
    --oxnv-okd-font-weight-400: 400;
    --oxnv-okd-font-weight-500: 500;
    --oxnv-okd-font-weight-600: 600;
    --oxnv-okd-font-weight-700: 700;
    --oxnv-okd-font-weight-800: 800;
    --oxnv-okd-font-weight-900: 900;
    --oxnv-okd-font-weight-regular: 400;
    --oxnv-okd-font-weight-medium: 500;
    --oxnv-okd-font-weight-bold: 700
}

.theme-dark {
    --oxnv-okd-color-gray-050: #000;
    --oxnv-okd-color-gray-100: #2e2e2e;
    --oxnv-okd-color-gray-200: #404040;
    --oxnv-okd-color-gray-300: #6c6c6c;
    --oxnv-okd-color-gray-400: #909090;
    --oxnv-okd-color-gray-500: #b0b0b0;
    --oxnv-okd-color-gray-600: #ccc;
    --oxnv-okd-color-gray-700: #e3e3e3;
    --oxnv-okd-color-gray-800: #f0f0f0;
    --oxnv-okd-color-gray-900: #fafafa;
    --oxnv-okd-color-blue-050: #051738;
    --oxnv-okd-color-blue-100: #082356;
    --oxnv-okd-color-blue-200: #0c3178;
    --oxnv-okd-color-blue-300: #0f3c94;
    --oxnv-okd-color-blue-400: #1148b0;
    --oxnv-okd-color-blue-500: #1453cc;
    --oxnv-okd-color-blue-600: #175fe8;
    --oxnv-okd-color-blue-700: #1e6bff;
    --oxnv-okd-color-blue-800: #3077ff;
    --oxnv-okd-color-blue-900: #4283ff;
    --oxnv-okd-color-green-050: #002b1f;
    --oxnv-okd-color-green-100: #062b12;
    --oxnv-okd-color-green-200: #0c5625;
    --oxnv-okd-color-green-300: #138037;
    --oxnv-okd-color-green-400: #19ab4a;
    --oxnv-okd-color-green-500: #25a750;
    --oxnv-okd-color-green-600: #4cde7d;
    --oxnv-okd-color-green-700: #79e69d;
    --oxnv-okd-color-green-800: #a5efbe;
    --oxnv-okd-color-green-900: #d2f7de;
    --oxnv-okd-color-red-050: #270b12;
    --oxnv-okd-color-red-100: #300e17;
    --oxnv-okd-color-red-200: #601d2e;
    --oxnv-okd-color-red-300: #902b44;
    --oxnv-okd-color-red-400: #c03a5b;
    --oxnv-okd-color-red-500: #f04872;
    --oxnv-okd-color-red-600: #f76489;
    --oxnv-okd-color-red-700: #f994ae;
    --oxnv-okd-color-red-800: #f9b6c7;
    --oxnv-okd-color-red-900: #fff8f9;
    --oxnv-okd-color-orange-050: #361604;
    --oxnv-okd-color-orange-100: #532206;
    --oxnv-okd-color-orange-200: #743008;
    --oxnv-okd-color-orange-300: #8f3b0a;
    --oxnv-okd-color-orange-400: #aa460c;
    --oxnv-okd-color-orange-500: #c5510e;
    --oxnv-okd-color-orange-600: #e15c0f;
    --oxnv-okd-color-orange-700: #f76816;
    --oxnv-okd-color-orange-800: #f87428;
    --oxnv-okd-color-orange-900: #fa8c4d;
    --oxnv-okd-color-yellow-050: #2d2104;
    --oxnv-okd-color-yellow-100: #493603;
    --oxnv-okd-color-yellow-200: #674b04;
    --oxnv-okd-color-yellow-300: #7f5d05;
    --oxnv-okd-color-yellow-400: #966e06;
    --oxnv-okd-color-yellow-500: #ae8007;
    --oxnv-okd-color-yellow-600: #c69208;
    --oxnv-okd-color-yellow-700: #dba20e;
    --oxnv-okd-color-yellow-800: #dea921;
    --oxnv-okd-color-yellow-900: #e0b134;
    --oxnv-okd-color-text-white: #fff;
    --oxnv-okd-color-text-black: #1f2933;
    --oxnv-okd-color-background-1: #121212;
    --oxnv-okd-color-background-2: #1a1a1a;
    --oxnv-okd-color-transparent: transparent;
    --oxnv-okd-color-white: #fff;
    --oxnv-okd-color-black: #000;
    --oxnv-okd-color-line-muted: #2e2e2e;
    --oxnv-okd-color-line-amplifed: #6c6c6c;
    --oxnv-okd-color-line-secondary: #404040;
    --oxnv-okd-color-text-lighter: #6c6c6c;
    --oxnv-okd-color-text-light: #909090;
    --oxnv-okd-color-text-secondary: #e3e3e3;
    --oxnv-okd-color-text-amplifed: #fafafa;
    --oxnv-okd-color-background-3: #242424;
    --oxnv-okd-color-fq-blue-lv1: #3077ff;
    --oxnv-okd-color-fq-blue-lv2: #1e6bff;
    --oxnv-okd-color-fq-green-lv1: #1fd65c;
    --oxnv-okd-color-fq-red-lv1: #f04872;
    --oxnv-okd-color-fq-orange-lv1: #f76816;
    --oxnv-okd-color-prefer-red-chart: #f04872;
    --oxnv-okd-color-prefer-red-bg: #ca3f64;
    --oxnv-okd-color-prefer-green-chart: #1fd65c;
    --oxnv-okd-color-prefer-green-bg: #25a750;
    --oxnv-okd-color-prefer-red-text: #ca3f64;
    --oxnv-okd-color-prefer-green-text: #25a750;
    --oxnv-okd-color-branded-primary: #bcff2f;
    --oxnv-okd-color-fq-critical: #f04872;
    --oxnv-okd-color-fq-positive: #25a750;
    --oxnv-okd-color-fq-warning: #f76816;
    --oxnv-okd-color-fq-accent: #1e6bff;
    --oxnv-okd-color-fq-neutral: #fafafa;
    --oxnv-okd-color-prefer-neutral-bg: #909090;
    --oxnv-okd-color-prefer-neutral-text: #909090;
    --oxnv-okd-color-white-opacity-5: #fff;
    --oxnv-okd-color-white-opacity-10: hsla(0,0%,100%,.94);
    --oxnv-okd-color-white-opacity-20: hsla(0,0%,100%,.88);
    --oxnv-okd-color-white-opacity-30: hsla(0,0%,100%,.78);
    --oxnv-okd-color-white-opacity-40: hsla(0,0%,100%,.76);
    --oxnv-okd-color-white-opacity-50: hsla(0,0%,100%,.54);
    --oxnv-okd-color-white-opacity-60: hsla(0,0%,100%,.36);
    --oxnv-okd-color-white-opacity-70: hsla(0,0%,100%,.19);
    --oxnv-okd-color-white-opacity-80: hsla(0,0%,100%,.12);
    --oxnv-okd-color-white-opacity-90: hsla(0,0%,100%,.06);
    --oxnv-okd-color-black-opacity-5: #000;
    --oxnv-okd-color-black-opacity-10: rgba(0,0,0,.9);
    --oxnv-okd-color-black-opacity-20: rgba(0,0,0,.76);
    --oxnv-okd-color-black-opacity-30: rgba(0,0,0,.68);
    --oxnv-okd-color-black-opacity-40: rgba(0,0,0,.57);
    --oxnv-okd-color-black-opacity-50: rgba(0,0,0,.43);
    --oxnv-okd-color-black-opacity-60: rgba(0,0,0,.26);
    --oxnv-okd-color-black-opacity-70: rgba(0,0,0,.14);
    --oxnv-okd-color-black-opacity-80: rgba(0,9,3,.08);
    --oxnv-okd-color-black-opacity-90: rgba(0,0,0,.04);
    --oxnv-okd-color-neutral-5: #fff;
    --oxnv-okd-color-neutral-10: #fafafa;
    --oxnv-okd-color-neutral-20: #f3f3f3;
    --oxnv-okd-color-neutral-30: #e6e6e6;
    --oxnv-okd-color-neutral-40: #d9d9d9;
    --oxnv-okd-color-neutral-50: #c7c7c7;
    --oxnv-okd-color-neutral-60: #b3b3b3;
    --oxnv-okd-color-neutral-70: #a7a7a7;
    --oxnv-okd-color-neutral-80: #999;
    --oxnv-okd-color-neutral-90: #909090;
    --oxnv-okd-color-neutral-100: grey;
    --oxnv-okd-color-neutral-110: #757575;
    --oxnv-okd-color-neutral-120: #666;
    --oxnv-okd-color-neutral-130: #5b5b5b;
    --oxnv-okd-color-neutral-140: #4d4d4d;
    --oxnv-okd-color-neutral-150: #414141;
    --oxnv-okd-color-neutral-160: #383838;
    --oxnv-okd-color-neutral-170: #272727;
    --oxnv-okd-color-neutral-180: #1d1d1d;
    --oxnv-okd-color-neutral-190: #0e0e0e;
    --oxnv-okd-color-neutral-200: #000;
    --oxnv-okd-color-tangerine-5: #ffedcb;
    --oxnv-okd-color-tangerine-10: #ffd37d;
    --oxnv-okd-color-tangerine-30: #ffb117;
    --oxnv-okd-color-tangerine-40: #db8f00;
    --oxnv-okd-color-tangerine-50: #a06900;
    --oxnv-okd-color-tangerine-60: #664300;
    --oxnv-okd-color-lemon-5: #ffdc4;
    --oxnv-okd-color-lemon-10: #fffa7a;
    --oxnv-okd-color-lemon-20: #fff500;
    --oxnv-okd-color-lemon-30: #e5dd00;
    --oxnv-okd-color-lemon-40: #b2ab00;
    --oxnv-okd-color-lemon-50: #797400;
    --oxnv-okd-color-lemon-60: #5c5800;
    --oxnv-okd-color-tangerine-20: #ffc452;
    --oxnv-okd-color-neonlime-5: #e6ffb0;
    --oxnv-okd-color-neonlime-10: #d5ff7d;
    --oxnv-okd-color-neonlime-20: #bcff2f;
    --oxnv-okd-color-neonlime-30: #9fe212;
    --oxnv-okd-color-neonlime-40: #8ec51d;
    --oxnv-okd-color-neonlime-50: #568000;
    --oxnv-okd-color-neonlime-60: #3d5c00;
    --oxnv-okd-color-neonmint-5: #cbffe0;
    --oxnv-okd-color-neonmint-10: #7dffb1;
    --oxnv-okd-color-neonmint-20: #24ff7b;
    --oxnv-okd-color-neonmint-30: #12e366;
    --oxnv-okd-color-neonmint-40: #00bc4b;
    --oxnv-okd-color-neonmint-50: #008535;
    --oxnv-okd-color-neonmint-60: #005c25;
    --oxnv-okd-color-bluebell-5: #e6eaff;
    --oxnv-okd-color-bluebell-10: #b8bfff;
    --oxnv-okd-color-bluebell-20: #8a91ff;
    --oxnv-okd-color-bluebell-30: #5f62ff;
    --oxnv-okd-color-bluebell-40: #5043ff;
    --oxnv-okd-color-bluebell-50: #4c2fff;
    --oxnv-okd-color-bluebell-60: #1d00d4;
    --oxnv-okd-color-lavender-5: #f2e8ff;
    --oxnv-okd-color-lavender-10: #dbbfff;
    --oxnv-okd-color-lavender-20: #c496ff;
    --oxnv-okd-color-lavender-30: #ac6cff;
    --oxnv-okd-color-lavender-40: #9543ff;
    --oxnv-okd-color-lavender-50: #7e1aff;
    --oxnv-okd-color-lavender-60: #5600c5;
    --oxnv-okd-color-orchid-5: #fee7ea;
    --oxnv-okd-color-orchid-10: #ffc1c9;
    --oxnv-okd-color-orchid-20: #ffa8b3;
    --oxnv-okd-color-orchid-30: #ff7888;
    --oxnv-okd-color-orchid-40: #f5384f;
    --oxnv-okd-color-orchid-50: #cd2438;
    --oxnv-okd-color-orchid-60: #9a1b2a;
    --oxnv-okd-color-semantic-positive-1: #25a750;
    --oxnv-okd-color-semantic-negative-1: #ca3f64;
    --oxnv-okd-color-background-lv1: #121212;
    --oxnv-okd-color-background-lv2: #1a1a1a;
    --oxnv-okd-color-transparent-base-black: transparent;
    --oxnv-okd-color-transparent-base-white: transparent;
    --oxnv-okd-color-alert-base-info: #2e2e2e;
    --oxnv-okd-color-alert-base-success: #002b1f;
    --oxnv-okd-color-alert-base-warning: #361604;
    --oxnv-okd-color-alert-base-error: #270b12;
    --oxnv-okd-color-basil-5: #e9f4d1;
    --oxnv-okd-color-basil-10: #d2e8a4;
    --oxnv-okd-color-basil-20: #81be00;
    --oxnv-okd-color-basil-30: #49a92d;
    --oxnv-okd-color-basil-40: #2b6d17;
    --oxnv-okd-color-basil-50: #1a410e;
    --oxnv-okd-color-basil-60: #1a2600;
    --oxnv-okd-color-rose-5: #ffdfe9;
    --oxnv-okd-color-rose-10: #ffc0d3;
    --oxnv-okd-color-rose-20: #ff5eb6;
    --oxnv-okd-color-rose-30: #fc46ab;
    --oxnv-okd-color-rose-40: #a54162;
    --oxnv-okd-color-rose-50: #532131;
    --oxnv-okd-color-rose-60: #2a111f;
    --oxnv-okd-color-neutral-15: #f6f6f6;
    --oxnv-okd-color-neutral-185: #121212;
    --oxnv-okd-color-background-base-primary: #000;
    --oxnv-okd-color-background-base-secondary: #121212;
    --oxnv-okd-color-background-surface-primary: #1d1d1d;
    --oxnv-okd-color-background-surface-secondary: #121212;
    --oxnv-okd-color-background-surface-pressed: #383838;
    --oxnv-okd-color-background-surface-disable: #0e0e0e;
    --oxnv-okd-color-background-scrim: rgba(0,0,0,.68);
    --oxnv-okd-color-container-primary: #272727;
    --oxnv-okd-color-container-secondary: #272727;
    --oxnv-okd-color-container-tertiary: #383838;
    --oxnv-okd-color-container-contrast: #414141;
    --oxnv-okd-color-container-inverse: #fafafa;
    --oxnv-okd-color-content-primary: #fff;
    --oxnv-okd-color-content-secondary: #e6e6e6;
    --oxnv-okd-color-content-tertiary: #b3b3b3;
    --oxnv-okd-color-content-contrast: #909090;
    --oxnv-okd-color-content-disabled: #5b5b5b;
    --oxnv-okd-color-content-inverse: #000;
    --oxnv-okd-color-border-primary: #383838;
    --oxnv-okd-color-border-secondary: #4d4d4d;
    --oxnv-okd-color-border-contrast: #000;
    --oxnv-okd-color-border-selected: #fff;
    --oxnv-okd-color-semantic-neutral: #fff;
    --oxnv-okd-color-semantic-notice: #ffb117;
    --oxnv-okd-color-semantic-positive: #25a750;
    --oxnv-okd-color-semantic-negative: #ca3f64;
    --oxnv-okd-color-semantic-informative: #8a91ff;
    --oxnv-okd-color-semantic-highlight: #bcff2f;
    --oxnv-okd-color-dvp-neutral: hsla(0,0%,100%,.76);
    --oxnv-okd-color-dvp-profit: #25a750;
    --oxnv-okd-color-dvp-loss: #ca3f64;
    --oxnv-okd-color-categorical-01: #5f62ff;
    --oxnv-okd-color-categorical-02: #ffb117;
    --oxnv-okd-color-categorical-03: #bcff2f;
    --oxnv-okd-color-categorical-04: #00bc4b;
    --oxnv-okd-color-categorical-05: #f5384f;
    --oxnv-okd-color-transparent-white: transparent;
    --oxnv-okd-color-transparent-black: hsla(0,0%,100%,.02);
    --oxnv-okd-color-common-transparent: hsla(0,0%,100%,0);
    --oxnv-okd-color-container-lv2: #1a1a1a;
    --oxnv-okd-color-alert-info: #2e2e2e;
    --oxnv-okd-color-alert-success: #002b1f;
    --oxnv-okd-color-alert-warning: #361604;
    --oxnv-okd-color-alert-error: #270b12;
    --oxnv-okd-color-common-background-2: #383838;
    --oxnv-okd-color-data-visualization-category-01: #5f62ff;
    --oxnv-okd-color-data-visualization-category-02: #ffb117;
    --oxnv-okd-color-data-visualization-category-03: #bcff2f;
    --oxnv-okd-color-data-visualization-category-04: #00bc4b;
    --oxnv-okd-color-data-visualization-category-05: #f5384f;
    --oxnv-okd-color-preference-loss: #ca3f64;
    --oxnv-okd-color-preference-profit: #25a750;
    --oxnv-okd-color-preference-neutral: hsla(0,0%,100%,.76);
    --oxnv-okd-color-border-focus: #fff;
    --oxnv-okd-color-background-base-primaryAlternative: #000;
    --oxnv-okd-color-link-content: #8a91ff;
    --oxnv-okd-color-link-accent-content-primary: #bcff2f;
    --oxnv-okd-color-background-surface-contrast: #272727;
    --oxnv-okd-color-background-surface-brand: #bcff2f;
    --oxnv-okd-color-border-tertiary: #0e0e0e;
    --oxnv-okd-color-content-brand: #bcff2f;
    --oxnv-okd-color-modal-primary: #0e0e0e;
    --oxnv-okd-color-modal-secondary: #272727;
    --oxnv-okd-color-modal-tertiary: #383838;
    --oxnv-okd-color-modal-contrast: #4d4d4d;
    --oxnv-okd-color-card-primary: #0e0e0e;
    --oxnv-okd-color-card-secondary: #121212;
    --oxnv-okd-color-brand-primary: #121212;
    --oxnv-okd-color-brand-primary-alternative: #bcff2f;
    --oxnv-okd-color-brand-secondary: #272727;
    --oxnv-okd-color-brand-tertiary: #383838;
    --oxnv-okd-color-brand-content: #e6ffb0;
    --oxnv-okd-color-brand-content-contrast: #000;
    --oxnv-okd-font-size-base: 16px;
    --oxnv-okd-font-size-md: 14px;
    --oxnv-okd-font-size-xs: 12px;
    --oxnv-okd-line-height-base: 20px;
    --oxnv-okd-line-height-md: 20px;
    --oxnv-okd-line-height-xs: 16px;
    --oxnv-okd-shadow-none: 0 0 0 0 transparent;
    --oxnv-okd-shadow-xs: 0 0 0 1px #0000000d;
    --oxnv-okd-shadow-sm: 0 1px 2px 0 #0000000d;
    --oxnv-okd-shadow-default: 0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;
    --oxnv-okd-shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;
    --oxnv-okd-shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;
    --oxnv-okd-shadow-xl: 0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;
    --oxnv-okd-shadow-2xl: 0 25px 50px -12px #00000040;
    --oxnv-okd-border-radius-none: 0;
    --oxnv-okd-border-radius-sm: 2px;
    --oxnv-okd-border-radius-md: 4px;
    --oxnv-okd-border-radius-lg: 6px;
    --oxnv-okd-border-radius-xl: 8px;
    --oxnv-okd-border-radius-xxl: 10px;
    --oxnv-okd-border-radius-xxxl: 12px;
    --oxnv-okd-font-family: HarmonyOS Sans,SF Pro Text,SF Pro Icons,Arial,Helvetica Neue,Helvetica,sans-serif;
    --oxnv-okd-text-display-lg-font-size: 56px;
    --oxnv-okd-text-display-lg-font-weight: 500;
    --oxnv-okd-text-display-lg-line-height: 1.32;
    --oxnv-okd-text-display-md-font-size: 40px;
    --oxnv-okd-text-display-md-font-weight: 500;
    --oxnv-okd-text-display-md-line-height: 52px;
    --oxnv-okd-text-display-sm-font-size: 40px;
    --oxnv-okd-text-display-sm-font-weight: 500;
    --oxnv-okd-text-display-sm-line-height: 52px;
    --oxnv-okd-text-heading-lg-font-size: 30px;
    --oxnv-okd-text-heading-lg-font-weight: 500;
    --oxnv-okd-text-heading-lg-line-height: 40px;
    --oxnv-okd-text-heading-md-font-size: 24px;
    --oxnv-okd-text-heading-md-font-weight: 500;
    --oxnv-okd-text-heading-md-line-height: 30px;
    --oxnv-okd-text-heading-sm-font-size: 18px;
    --oxnv-okd-text-heading-sm-font-weight: 500;
    --oxnv-okd-text-heading-sm-line-height: 24px;
    --oxnv-okd-text-heading-xl-font-size: 36px;
    --oxnv-okd-text-heading-xl-line-height: 1.32;
    --oxnv-okd-text-heading-xl-font-weight: 600;
    --oxnv-okd-text-heading-xxl-font-size: 40px;
    --oxnv-okd-text-heading-xxl-line-height: 1.32;
    --oxnv-okd-text-heading-xxl-font-weight: 600;
    --oxnv-okd-text-heading-overline-font-size: 12px;
    --oxnv-okd-text-heading-overline-line-height: 15px;
    --oxnv-okd-text-heading-overline-font-weight: 500;
    --oxnv-okd-text-body-sm-regular-font-size: 14px;
    --oxnv-okd-text-body-sm-regular-font-weight: 400;
    --oxnv-okd-text-body-sm-regular-line-height: 21px;
    --oxnv-okd-text-body-sm-bold-font-size: 14px;
    --oxnv-okd-text-body-sm-bold-font-weight: 500;
    --oxnv-okd-text-body-sm-bold-line-height: 21px;
    --oxnv-okd-text-body-md-regular-font-size: 16px;
    --oxnv-okd-text-body-md-regular-font-weight: 400;
    --oxnv-okd-text-body-md-regular-line-height: 24px;
    --oxnv-okd-text-body-md-bold-font-size: 16px;
    --oxnv-okd-text-body-md-bold-font-weight: 500;
    --oxnv-okd-text-body-md-bold-line-height: 24px;
    --oxnv-okd-text-body-xs-regular-font-size: 12px;
    --oxnv-okd-text-body-xs-regular-font-weight: 400;
    --oxnv-okd-text-body-xs-regular-line-height: 18px;
    --oxnv-okd-text-body-xs-bold-font-size: 12px;
    --oxnv-okd-text-body-xs-bold-font-weight: 500;
    --oxnv-okd-text-body-xs-bold-line-height: 18px;
    --oxnv-okd-font-weight-400: 400;
    --oxnv-okd-font-weight-500: 500;
    --oxnv-okd-font-weight-600: 600;
    --oxnv-okd-font-weight-700: 700;
    --oxnv-okd-font-weight-800: 800;
    --oxnv-okd-font-weight-900: 900;
    --oxnv-okd-font-weight-regular: 400;
    --oxnv-okd-font-weight-medium: 500;
    --oxnv-okd-font-weight-bold: 700
}

@media (max-width: 767px) {
    [lang*=zh-Hans] .site-banner-container {
        min-height:80px
    }
}

.site-banner-container {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    padding: 22px 22px 14px;
    position: relative;
    width: 100%;
    z-index: 9499
}

@media (max-width: 767px) {
    .site-banner-container {
        min-height:96px;
        padding: 12px 16px 4px
    }
}

.site-banner-container .site-banner-text {
    display: flex;
    margin-bottom: 8px
}

.site-banner-container .site-banner-text .site-banner-tip {
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin-left: 8px;
    vertical-align: middle
}

@media (max-width: 767px) {
    .site-banner-container .site-banner-text .site-banner-tip {
        font-size:12px
    }
}

.site-banner-container .site-banner-text .site-banner-icon {
    font-size: 18px
}

@media (max-width: 767px) {
    .site-banner-container .site-banner-text .site-banner-icon {
        font-size:16px
    }
}

.site-banner-container .site-banner-link {
    -webkit-tap-highlight-color: transparent;
    align-items: center;
    -webkit-appearance: none;
    background-color: #0d0d0d;
    border: 0;
    border-radius: 60px;
    box-sizing: 0 0 0 0 transparent;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    font-weight: 500;
    justify-content: center;
    line-height: 16px;
    margin-bottom: 8px;
    margin-left: 24px;
    min-width: 63px;
    outline: none;
    padding: 8px 16px;
    text-decoration: none;
    touch-action: manipulation;
    transition: background-color .3s cubic-bezier(.165,.84,.44,1),border-color .3s cubic-bezier(.165,.84,.44,1);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

@media (max-width: 767px) {
    .site-banner-container .site-banner-link {
        font-size:12px;
        margin-left: 20px
    }
}




.theme-light,:root {
    --login-okd-color-gray-050: #f9f9f9;
    --login-okd-color-gray-100: #ebebeb;
    --login-okd-color-gray-200: #dbdbdb;
    --login-okd-color-gray-300: #bdbdbd;
    --login-okd-color-gray-400: #929292;
    --login-okd-color-gray-500: #6e6e6e;
    --login-okd-color-gray-600: #545454;
    --login-okd-color-gray-700: #3d3d3d;
    --login-okd-color-gray-800: #1a1a1a;
    --login-okd-color-gray-900: #000;
    --login-okd-color-blue-050: #f5f9ff;
    --login-okd-color-blue-100: #d1e3ff;
    --login-okd-color-blue-200: #afcfff;
    --login-okd-color-blue-300: #8dbbff;
    --login-okd-color-blue-400: #6ba6ff;
    --login-okd-color-blue-500: #4992ff;
    --login-okd-color-blue-600: #277dff;
    --login-okd-color-blue-700: #0569ff;
    --login-okd-color-blue-800: #005eea;
    --login-okd-color-blue-900: #0051ca;
    --login-okd-color-green-050: #f2fff7;
    --login-okd-color-green-100: #d2f4de;
    --login-okd-color-green-200: #a5e9be;
    --login-okd-color-green-300: #78de9d;
    --login-okd-color-green-400: #4bd37d;
    --login-okd-color-green-500: #31bd65;
    --login-okd-color-green-600: #18a04a;
    --login-okd-color-green-700: #127837;
    --login-okd-color-green-800: #0c5025;
    --login-okd-color-green-900: #0c5025;
    --login-okd-color-red-050: #fff8f9;
    --login-okd-color-red-100: #fcdce5;
    --login-okd-color-red-200: #f9b9ca;
    --login-okd-color-red-300: #f796b0;
    --login-okd-color-red-400: #f07596;
    --login-okd-color-red-500: #f1507b;
    --login-okd-color-red-600: #c14062;
    --login-okd-color-red-700: #91304a;
    --login-okd-color-red-800: #602031;
    --login-okd-color-red-900: #301019;
    --login-okd-color-orange-050: #fef9f6;
    --login-okd-color-orange-100: #fce3d4;
    --login-okd-color-orange-200: #fbceb4;
    --login-okd-color-orange-300: #f9b994;
    --login-okd-color-orange-400: #f7a474;
    --login-okd-color-orange-500: #f58f54;
    --login-okd-color-orange-600: #f6813d;
    --login-okd-color-orange-700: #f16514;
    --login-okd-color-orange-800: #e96010;
    --login-okd-color-orange-900: #bf4803;
    --login-okd-color-yellow-050: #fffcf5;
    --login-okd-color-yellow-100: #fff2d1;
    --login-okd-color-yellow-200: #ffe9af;
    --login-okd-color-yellow-300: #ffdf8d;
    --login-okd-color-yellow-400: #ffd66b;
    --login-okd-color-yellow-500: #ffcc49;
    --login-okd-color-yellow-600: #ffc327;
    --login-okd-color-yellow-700: #ffb905;
    --login-okd-color-yellow-800: #eaa900;
    --login-okd-color-yellow-900: #d29801;
    --login-okd-color-text-white: #fff;
    --login-okd-color-text-black: #1f2933;
    --login-okd-color-background-1: #fff;
    --login-okd-color-background-2: #f7f7f7;
    --login-okd-color-transparent: transparent;
    --login-okd-color-white: #fff;
    --login-okd-color-black: #000;
    --login-okd-color-line-muted: #ebebeb;
    --login-okd-color-line-secondary: #dbdbdb;
    --login-okd-color-line-amplifed: #bdbdbd;
    --login-okd-color-text-lighter: #bdbdbd;
    --login-okd-color-text-light: #929292;
    --login-okd-color-text-secondary: #3d3d3d;
    --login-okd-color-text-amplifed: #000;
    --login-okd-color-background-3: #f2f2f2;
    --login-okd-color-fq-blue-lv1: #0569ff;
    --login-okd-color-fq-green-lv1: #19cc5b;
    --login-okd-color-fq-red-lv1: #f1507b;
    --login-okd-color-fq-orange-lv1: #f16514;
    --login-okd-color-fq-blue-lv2: #0569ff;
    --login-okd-color-background-hover: #ebebeb;
    --login-okd-color-prefer-red-chart: #f1507b;
    --login-okd-color-prefer-red-bg: #eb4b6d;
    --login-okd-color-prefer-green-chart: #19cc5b;
    --login-okd-color-prefer-green-bg: #31bd65;
    --login-okd-color-prefer-red-text: #eb4b6d;
    --login-okd-color-prefer-green-text: #31bd65;
    --login-okd-color-branded-primary: #bcff2f;
    --login-okd-color-fq-critical: #eb4b6d;
    --login-okd-color-fq-warning: #f16514;
    --login-okd-color-fq-positive: #31bd65;
    --login-okd-color-fq-neutral: #000;
    --login-okd-color-fq-accent: #0569ff;
    --login-okd-color-prefer-neutral-text: #929292;
    --login-okd-color-prefer-neutral-bg: #929292;
    --login-okd-color-white-opacity-5: #fff;
    --login-okd-color-white-opacity-10: hsla(0,0%,100%,.94);
    --login-okd-color-white-opacity-20: hsla(0,0%,100%,.88);
    --login-okd-color-white-opacity-30: hsla(0,0%,100%,.78);
    --login-okd-color-white-opacity-40: hsla(0,0%,100%,.76);
    --login-okd-color-white-opacity-50: hsla(0,0%,100%,.54);
    --login-okd-color-white-opacity-60: hsla(0,0%,100%,.36);
    --login-okd-color-white-opacity-70: hsla(0,0%,100%,.19);
    --login-okd-color-white-opacity-80: hsla(0,0%,100%,.12);
    --login-okd-color-white-opacity-90: hsla(0,0%,100%,.06);
    --login-okd-color-black-opacity-5: #000;
    --login-okd-color-black-opacity-10: rgba(0,0,0,.9);
    --login-okd-color-black-opacity-20: rgba(0,0,0,.76);
    --login-okd-color-black-opacity-30: rgba(0,0,0,.68);
    --login-okd-color-black-opacity-40: rgba(0,0,0,.57);
    --login-okd-color-black-opacity-50: rgba(0,0,0,.43);
    --login-okd-color-black-opacity-60: rgba(0,0,0,.26);
    --login-okd-color-black-opacity-70: rgba(0,0,0,.14);
    --login-okd-color-black-opacity-80: rgba(0,9,3,.08);
    --login-okd-color-black-opacity-90: rgba(0,0,0,.04);
    --login-okd-color-neutral-5: #fff;
    --login-okd-color-neutral-10: #fafafa;
    --login-okd-color-neutral-20: #f3f3f3;
    --login-okd-color-neutral-30: #e6e6e6;
    --login-okd-color-neutral-40: #d9d9d9;
    --login-okd-color-neutral-50: #c7c7c7;
    --login-okd-color-neutral-60: #b3b3b3;
    --login-okd-color-neutral-70: #a7a7a7;
    --login-okd-color-neutral-80: #999;
    --login-okd-color-neutral-90: #909090;
    --login-okd-color-neutral-100: grey;
    --login-okd-color-neutral-110: #757575;
    --login-okd-color-neutral-120: #666;
    --login-okd-color-neutral-130: #5b5b5b;
    --login-okd-color-neutral-140: #4d4d4d;
    --login-okd-color-neutral-150: #414141;
    --login-okd-color-neutral-160: #383838;
    --login-okd-color-neutral-170: #272727;
    --login-okd-color-neutral-180: #1d1d1d;
    --login-okd-color-neutral-190: #0e0e0e;
    --login-okd-color-neutral-200: #000;
    --login-okd-color-tangerine-5: #ffedcb;
    --login-okd-color-tangerine-10: #ffd37d;
    --login-okd-color-tangerine-30: #ffb117;
    --login-okd-color-tangerine-40: #db8f00;
    --login-okd-color-tangerine-50: #a06900;
    --login-okd-color-tangerine-60: #664300;
    --login-okd-color-lemon-5: #fffdc4;
    --login-okd-color-lemon-10: #fffa7a;
    --login-okd-color-lemon-20: #fff500;
    --login-okd-color-lemon-30: #e5dd00;
    --login-okd-color-lemon-40: #b2ab00;
    --login-okd-color-lemon-50: #797400;
    --login-okd-color-lemon-60: #5c5800;
    --login-okd-color-tangerine-20: #ffc452;
    --login-okd-color-neonlime-5: #e6ffb0;
    --login-okd-color-neonlime-10: #d5ff7d;
    --login-okd-color-neonlime-20: #bcff2f;
    --login-okd-color-neonlime-30: #9fe212;
    --login-okd-color-neonlime-40: #8ec51d;
    --login-okd-color-neonlime-50: #568000;
    --login-okd-color-neonlime-60: #3d5c00;
    --login-okd-color-neonmint-5: #cbffe0;
    --login-okd-color-neonmint-10: #7dffb1;
    --login-okd-color-neonmint-20: #24ff7b;
    --login-okd-color-neonmint-30: #12e366;
    --login-okd-color-neonmint-40: #00bc4b;
    --login-okd-color-neonmint-50: #008535;
    --login-okd-color-neonmint-60: #005c25;
    --login-okd-color-bluebell-5: #e6eaff;
    --login-okd-color-bluebell-10: #b8bfff;
    --login-okd-color-bluebell-20: #8a91ff;
    --login-okd-color-bluebell-30: #5f62ff;
    --login-okd-color-bluebell-40: #5043ff;
    --login-okd-color-bluebell-50: #4c2fff;
    --login-okd-color-bluebell-60: #1d00d4;
    --login-okd-color-lavender-5: #f2e8ff;
    --login-okd-color-lavender-10: #dbbfff;
    --login-okd-color-lavender-20: #c496ff;
    --login-okd-color-lavender-30: #ac6cff;
    --login-okd-color-lavender-40: #9543ff;
    --login-okd-color-lavender-50: #7e1aff;
    --login-okd-color-lavender-60: #5600c5;
    --login-okd-color-orchid-5: #fee7ea;
    --login-okd-color-orchid-10: #ffc1c9;
    --login-okd-color-orchid-20: #ffa8b3;
    --login-okd-color-orchid-30: #ff7888;
    --login-okd-color-orchid-40: #f5384f;
    --login-okd-color-orchid-50: #cd2438;
    --login-okd-color-orchid-60: #9a1b2a;
    --login-okd-color-semantic-positive-1: #31bd65;
    --login-okd-color-semantic-negative-1: #eb4b6d;
    --login-okd-color-transparent-base-black: transparent;
    --login-okd-color-transparent-base-white: transparent;
    --login-okd-color-alert-base-info: #f7f7f7;
    --login-okd-color-alert-base-success: #eaf8f0;
    --login-okd-color-alert-base-warning: #fef9f6;
    --login-okd-color-alert-base-error: #fdedf0;
    --login-okd-color-basil-5: #e9f4d1;
    --login-okd-color-basil-10: #d2e8a4;
    --login-okd-color-basil-20: #81be00;
    --login-okd-color-basil-30: #49a92d;
    --login-okd-color-basil-40: #2b6d17;
    --login-okd-color-basil-50: #1a410e;
    --login-okd-color-basil-60: #1a2600;
    --login-okd-color-rose-5: #ffdfe9;
    --login-okd-color-rose-10: #ffc0d3;
    --login-okd-color-rose-20: #ff5eb6;
    --login-okd-color-rose-30: #fc46ab;
    --login-okd-color-rose-40: #a54162;
    --login-okd-color-rose-50: #532131;
    --login-okd-color-rose-60: #2a111f;
    --login-okd-color-neutral-15: #f6f6f6;
    --login-okd-color-neutral-185: #121212;
    --login-okd-color-background-base-primary: #fff;
    --login-okd-color-background-base-secondary: #fafafa;
    --login-okd-color-background-surface-primary: #f3f3f3;
    --login-okd-color-background-surface-secondary: #f6f6f6;
    --login-okd-color-background-surface-pressed: #d9d9d9;
    --login-okd-color-background-surface-disable: #fafafa;
    --login-okd-color-background-scrim: rgba(0,0,0,.43);
    --login-okd-color-container-primary: #fff;
    --login-okd-color-container-secondary: #fafafa;
    --login-okd-color-container-tertiary: #fff;
    --login-okd-color-container-contrast: #414141;
    --login-okd-color-container-inverse: #0e0e0e;
    --login-okd-color-content-primary: #000;
    --login-okd-color-content-secondary: #383838;
    --login-okd-color-content-tertiary: #5b5b5b;
    --login-okd-color-content-contrast: #909090;
    --login-okd-color-content-disabled: #b3b3b3;
    --login-okd-color-content-inverse: #fff;
    --login-okd-color-border-primary: #e6e6e6;
    --login-okd-color-border-secondary: #b3b3b3;
    --login-okd-color-border-contrast: #fafafa;
    --login-okd-color-border-selected: #000;
    --login-okd-color-semantic-neutral: #000;
    --login-okd-color-semantic-notice: #ffb117;
    --login-okd-color-semantic-positive: #31bd65;
    --login-okd-color-semantic-negative: #eb4b6d;
    --login-okd-color-semantic-informative: #8a91ff;
    --login-okd-color-semantic-highlight: #bcff2f;
    --login-okd-color-dvp-neutral: rgba(0,0,0,.57);
    --login-okd-color-dvp-profit: #00bc4b;
    --login-okd-color-dvp-loss: #f5384f;
    --login-okd-color-categorical-01: #8a91ff;
    --login-okd-color-categorical-02: #ffb117;
    --login-okd-color-categorical-03: #bcff2f;
    --login-okd-color-categorical-04: #12e366;
    --login-okd-color-categorical-05: #ff7888;
    --login-okd-color-common-transparent: hsla(0,0%,100%,0);
    --login-okd-color-transparent-black: transparent;
    --login-okd-color-transparent-white: transparent;
    --login-okd-color-alert-info: #f7f7f7;
    --login-okd-color-alert-success: #eaf8f0;
    --login-okd-color-alert-warning: #fef9f6;
    --login-okd-color-alert-error: #fdedf0;
    --login-okd-color-common-background-2: #f3f3f3;
    --login-okd-color-data-visualization-category-01: #8a91ff;
    --login-okd-color-data-visualization-category-02: #ffb117;
    --login-okd-color-data-visualization-category-03: #bcff2f;
    --login-okd-color-data-visualization-category-04: #12e366;
    --login-okd-color-data-visualization-category-05: #ff7888;
    --login-okd-color-preference-loss: #f5384f;
    --login-okd-color-preference-profit: #00bc4b;
    --login-okd-color-preference-neutral: rgba(0,0,0,.57);
    --login-okd-color-border-focus: #000;
    --login-okd-color-background-base-primaryAlternative: #fff;
    --login-okd-color-link-content: #4c2fff;
    --login-okd-color-link-accent-content-primary: #2b6d17;
    --login-okd-color-background-surface-contrast: #fff;
    --login-okd-color-background-surface-brand: #000;
    --login-okd-color-border-tertiary: #f3f3f3;
    --login-okd-color-content-brand: #000;
    --login-okd-color-modal-primary: #fff;
    --login-okd-color-modal-secondary: #fff;
    --login-okd-color-modal-tertiary: #fff;
    --login-okd-color-modal-contrast: #4d4d4d;
    --login-okd-color-card-primary: #f6f6f6;
    --login-okd-color-card-secondary: #f6f6f6;
    --login-okd-color-brand-primary: #2b6d17;
    --login-okd-color-brand-primary-alternative: #2b6d17;
    --login-okd-color-brand-secondary: #8ec51d;
    --login-okd-color-brand-tertiary: #bcff2f;
    --login-okd-color-brand-content: #e6ffb0;
    --login-okd-color-brand-content-contrast: #e6ffb0;
    --login-okd-font-size-base: 16px;
    --login-okd-font-size-md: 16px;
    --login-okd-font-size-xs: 12px;
    --login-okd-line-height-base: 20px;
    --login-okd-line-height-md: 20px;
    --login-okd-line-height-xs: 16px;
    --login-okd-shadow-none: 0 0 0 0 transparent;
    --login-okd-shadow-xs: 0 0 0 1px #0000000d;
    --login-okd-shadow-sm: 0 1px 2px 0 #0000000d;
    --login-okd-shadow-default: 0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;
    --login-okd-shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;
    --login-okd-shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;
    --login-okd-shadow-xl: 0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;
    --login-okd-shadow-2xl: 0 25px 50px -12px #00000040;
    --login-okd-border-radius-none: 0;
    --login-okd-border-radius-sm: 2px;
    --login-okd-border-radius-md: 4px;
    --login-okd-border-radius-lg: 6px;
    --login-okd-border-radius-xl: 8px;
    --login-okd-border-radius-xxl: 10px;
    --login-okd-border-radius-xxxl: 12px;
    --login-okd-font-family: HarmonyOS Sans,SF Pro Text,SF Pro Icons,Arial,Helvetica Neue,Helvetica,sans-serif;
    --login-okd-text-display-lg-font-size: 56px;
    --login-okd-text-display-lg-font-weight: 500;
    --login-okd-text-display-lg-line-height: 1.32;
    --login-okd-text-display-md-font-size: 40px;
    --login-okd-text-display-md-font-weight: 500;
    --login-okd-text-display-md-line-height: 52px;
    --login-okd-text-display-sm-font-size: 40px;
    --login-okd-text-display-sm-font-weight: 500;
    --login-okd-text-display-sm-line-height: 52px;
    --login-okd-text-heading-lg-font-size: 30px;
    --login-okd-text-heading-lg-font-weight: 500;
    --login-okd-text-heading-lg-line-height: 40px;
    --login-okd-text-heading-md-font-size: 24px;
    --login-okd-text-heading-md-font-weight: 500;
    --login-okd-text-heading-md-line-height: 30px;
    --login-okd-text-heading-sm-font-size: 18px;
    --login-okd-text-heading-sm-font-weight: 500;
    --login-okd-text-heading-sm-line-height: 24px;
    --login-okd-text-heading-xl-font-size: 36px;
    --login-okd-text-heading-xl-line-height: 1.32;
    --login-okd-text-heading-xl-font-weight: 600;
    --login-okd-text-heading-xxl-font-size: 40px;
    --login-okd-text-heading-xxl-line-height: 1.32;
    --login-okd-text-heading-xxl-font-weight: 600;
    --login-okd-text-heading-overline-font-size: 12px;
    --login-okd-text-heading-overline-line-height: 15px;
    --login-okd-text-heading-overline-font-weight: 500;
    --login-okd-text-body-sm-regular-font-size: 14px;
    --login-okd-text-body-sm-regular-font-weight: 400;
    --login-okd-text-body-sm-regular-line-height: 21px;
    --login-okd-text-body-sm-bold-font-size: 14px;
    --login-okd-text-body-sm-bold-font-weight: 500;
    --login-okd-text-body-sm-bold-line-height: 21px;
    --login-okd-text-body-md-regular-font-size: 16px;
    --login-okd-text-body-md-regular-font-weight: 400;
    --login-okd-text-body-md-regular-line-height: 24px;
    --login-okd-text-body-md-bold-font-size: 16px;
    --login-okd-text-body-md-bold-font-weight: 500;
    --login-okd-text-body-md-bold-line-height: 24px;
    --login-okd-text-body-xs-regular-font-size: 12px;
    --login-okd-text-body-xs-regular-font-weight: 400;
    --login-okd-text-body-xs-regular-line-height: 18px;
    --login-okd-text-body-xs-bold-font-size: 12px;
    --login-okd-text-body-xs-bold-font-weight: 500;
    --login-okd-text-body-xs-bold-line-height: 18px;
    --login-okd-font-weight-400: 400;
    --login-okd-font-weight-500: 500;
    --login-okd-font-weight-600: 600;
    --login-okd-font-weight-700: 700;
    --login-okd-font-weight-800: 800;
    --login-okd-font-weight-900: 900;
    --login-okd-font-weight-regular: 400;
    --login-okd-font-weight-medium: 500;
    --login-okd-font-weight-bold: 700
}

.theme-dark {
    --login-okd-color-gray-050: #000;
    --login-okd-color-gray-100: #2e2e2e;
    --login-okd-color-gray-200: #404040;
    --login-okd-color-gray-300: #6c6c6c;
    --login-okd-color-gray-400: #909090;
    --login-okd-color-gray-500: #b0b0b0;
    --login-okd-color-gray-600: #ccc;
    --login-okd-color-gray-700: #e3e3e3;
    --login-okd-color-gray-800: #f0f0f0;
    --login-okd-color-gray-900: #fafafa;
    --login-okd-color-blue-050: #051738;
    --login-okd-color-blue-100: #082356;
    --login-okd-color-blue-200: #0c3178;
    --login-okd-color-blue-300: #0f3c94;
    --login-okd-color-blue-400: #1148b0;
    --login-okd-color-blue-500: #1453cc;
    --login-okd-color-blue-600: #175fe8;
    --login-okd-color-blue-700: #1e6bff;
    --login-okd-color-blue-800: #3077ff;
    --login-okd-color-blue-900: #4283ff;
    --login-okd-color-green-050: #002b1f;
    --login-okd-color-green-100: #062b12;
    --login-okd-color-green-200: #0c5625;
    --login-okd-color-green-300: #138037;
    --login-okd-color-green-400: #19ab4a;
    --login-okd-color-green-500: #25a750;
    --login-okd-color-green-600: #4cde7d;
    --login-okd-color-green-700: #79e69d;
    --login-okd-color-green-800: #a5efbe;
    --login-okd-color-green-900: #d2f7de;
    --login-okd-color-red-050: #270b12;
    --login-okd-color-red-100: #300e17;
    --login-okd-color-red-200: #601d2e;
    --login-okd-color-red-300: #902b44;
    --login-okd-color-red-400: #c03a5b;
    --login-okd-color-red-500: #f04872;
    --login-okd-color-red-600: #f76489;
    --login-okd-color-red-700: #f994ae;
    --login-okd-color-red-800: #f9b6c7;
    --login-okd-color-red-900: #fff8f9;
    --login-okd-color-orange-050: #361604;
    --login-okd-color-orange-100: #532206;
    --login-okd-color-orange-200: #743008;
    --login-okd-color-orange-300: #8f3b0a;
    --login-okd-color-orange-400: #aa460c;
    --login-okd-color-orange-500: #c5510e;
    --login-okd-color-orange-600: #e15c0f;
    --login-okd-color-orange-700: #f76816;
    --login-okd-color-orange-800: #f87428;
    --login-okd-color-orange-900: #fa8c4d;
    --login-okd-color-yellow-050: #2d2104;
    --login-okd-color-yellow-100: #493603;
    --login-okd-color-yellow-200: #674b04;
    --login-okd-color-yellow-300: #7f5d05;
    --login-okd-color-yellow-400: #966e06;
    --login-okd-color-yellow-500: #ae8007;
    --login-okd-color-yellow-600: #c69208;
    --login-okd-color-yellow-700: #dba20e;
    --login-okd-color-yellow-800: #dea921;
    --login-okd-color-yellow-900: #e0b134;
    --login-okd-color-text-white: #fff;
    --login-okd-color-text-black: #1f2933;
    --login-okd-color-background-1: #121212;
    --login-okd-color-background-2: #1a1a1a;
    --login-okd-color-transparent: transparent;
    --login-okd-color-white: #fff;
    --login-okd-color-black: #000;
    --login-okd-color-line-muted: #2e2e2e;
    --login-okd-color-line-amplifed: #6c6c6c;
    --login-okd-color-line-secondary: #404040;
    --login-okd-color-text-lighter: #6c6c6c;
    --login-okd-color-text-light: #909090;
    --login-okd-color-text-secondary: #e3e3e3;
    --login-okd-color-text-amplifed: #fafafa;
    --login-okd-color-background-3: #242424;
    --login-okd-color-fq-blue-lv1: #3077ff;
    --login-okd-color-fq-blue-lv2: #1e6bff;
    --login-okd-color-fq-green-lv1: #1fd65c;
    --login-okd-color-fq-red-lv1: #f04872;
    --login-okd-color-fq-orange-lv1: #f76816;
    --login-okd-color-prefer-red-chart: #f04872;
    --login-okd-color-prefer-red-bg: #ca3f64;
    --login-okd-color-prefer-green-chart: #1fd65c;
    --login-okd-color-prefer-green-bg: #25a750;
    --login-okd-color-prefer-red-text: #ca3f64;
    --login-okd-color-prefer-green-text: #25a750;
    --login-okd-color-branded-primary: #bcff2f;
    --login-okd-color-fq-critical: #f04872;
    --login-okd-color-fq-positive: #25a750;
    --login-okd-color-fq-warning: #f76816;
    --login-okd-color-fq-accent: #1e6bff;
    --login-okd-color-fq-neutral: #fafafa;
    --login-okd-color-prefer-neutral-bg: #909090;
    --login-okd-color-prefer-neutral-text: #909090;
    --login-okd-color-white-opacity-5: #fff;
    --login-okd-color-white-opacity-10: hsla(0,0%,100%,.94);
    --login-okd-color-white-opacity-20: hsla(0,0%,100%,.88);
    --login-okd-color-white-opacity-30: hsla(0,0%,100%,.78);
    --login-okd-color-white-opacity-40: hsla(0,0%,100%,.76);
    --login-okd-color-white-opacity-50: hsla(0,0%,100%,.54);
    --login-okd-color-white-opacity-60: hsla(0,0%,100%,.36);
    --login-okd-color-white-opacity-70: hsla(0,0%,100%,.19);
    --login-okd-color-white-opacity-80: hsla(0,0%,100%,.12);
    --login-okd-color-white-opacity-90: hsla(0,0%,100%,.06);
    --login-okd-color-black-opacity-5: #000;
    --login-okd-color-black-opacity-10: rgba(0,0,0,.9);
    --login-okd-color-black-opacity-20: rgba(0,0,0,.76);
    --login-okd-color-black-opacity-30: rgba(0,0,0,.68);
    --login-okd-color-black-opacity-40: rgba(0,0,0,.57);
    --login-okd-color-black-opacity-50: rgba(0,0,0,.43);
    --login-okd-color-black-opacity-60: rgba(0,0,0,.26);
    --login-okd-color-black-opacity-70: rgba(0,0,0,.14);
    --login-okd-color-black-opacity-80: rgba(0,9,3,.08);
    --login-okd-color-black-opacity-90: rgba(0,0,0,.04);
    --login-okd-color-neutral-5: #fff;
    --login-okd-color-neutral-10: #fafafa;
    --login-okd-color-neutral-20: #f3f3f3;
    --login-okd-color-neutral-30: #e6e6e6;
    --login-okd-color-neutral-40: #d9d9d9;
    --login-okd-color-neutral-50: #c7c7c7;
    --login-okd-color-neutral-60: #b3b3b3;
    --login-okd-color-neutral-70: #a7a7a7;
    --login-okd-color-neutral-80: #999;
    --login-okd-color-neutral-90: #909090;
    --login-okd-color-neutral-100: grey;
    --login-okd-color-neutral-110: #757575;
    --login-okd-color-neutral-120: #666;
    --login-okd-color-neutral-130: #5b5b5b;
    --login-okd-color-neutral-140: #4d4d4d;
    --login-okd-color-neutral-150: #414141;
    --login-okd-color-neutral-160: #383838;
    --login-okd-color-neutral-170: #272727;
    --login-okd-color-neutral-180: #1d1d1d;
    --login-okd-color-neutral-190: #0e0e0e;
    --login-okd-color-neutral-200: #000;
    --login-okd-color-tangerine-5: #ffedcb;
    --login-okd-color-tangerine-10: #ffd37d;
    --login-okd-color-tangerine-30: #ffb117;
    --login-okd-color-tangerine-40: #db8f00;
    --login-okd-color-tangerine-50: #a06900;
    --login-okd-color-tangerine-60: #664300;
    --login-okd-color-lemon-5: #ffdc4;
    --login-okd-color-lemon-10: #fffa7a;
    --login-okd-color-lemon-20: #fff500;
    --login-okd-color-lemon-30: #e5dd00;
    --login-okd-color-lemon-40: #b2ab00;
    --login-okd-color-lemon-50: #797400;
    --login-okd-color-lemon-60: #5c5800;
    --login-okd-color-tangerine-20: #ffc452;
    --login-okd-color-neonlime-5: #e6ffb0;
    --login-okd-color-neonlime-10: #d5ff7d;
    --login-okd-color-neonlime-20: #bcff2f;
    --login-okd-color-neonlime-30: #9fe212;
    --login-okd-color-neonlime-40: #8ec51d;
    --login-okd-color-neonlime-50: #568000;
    --login-okd-color-neonlime-60: #3d5c00;
    --login-okd-color-neonmint-5: #cbffe0;
    --login-okd-color-neonmint-10: #7dffb1;
    --login-okd-color-neonmint-20: #24ff7b;
    --login-okd-color-neonmint-30: #12e366;
    --login-okd-color-neonmint-40: #00bc4b;
    --login-okd-color-neonmint-50: #008535;
    --login-okd-color-neonmint-60: #005c25;
    --login-okd-color-bluebell-5: #e6eaff;
    --login-okd-color-bluebell-10: #b8bfff;
    --login-okd-color-bluebell-20: #8a91ff;
    --login-okd-color-bluebell-30: #5f62ff;
    --login-okd-color-bluebell-40: #5043ff;
    --login-okd-color-bluebell-50: #4c2fff;
    --login-okd-color-bluebell-60: #1d00d4;
    --login-okd-color-lavender-5: #f2e8ff;
    --login-okd-color-lavender-10: #dbbfff;
    --login-okd-color-lavender-20: #c496ff;
    --login-okd-color-lavender-30: #ac6cff;
    --login-okd-color-lavender-40: #9543ff;
    --login-okd-color-lavender-50: #7e1aff;
    --login-okd-color-lavender-60: #5600c5;
    --login-okd-color-orchid-5: #fee7ea;
    --login-okd-color-orchid-10: #ffc1c9;
    --login-okd-color-orchid-20: #ffa8b3;
    --login-okd-color-orchid-30: #ff7888;
    --login-okd-color-orchid-40: #f5384f;
    --login-okd-color-orchid-50: #cd2438;
    --login-okd-color-orchid-60: #9a1b2a;
    --login-okd-color-semantic-positive-1: #25a750;
    --login-okd-color-semantic-negative-1: #ca3f64;
    --login-okd-color-background-lv1: #121212;
    --login-okd-color-background-lv2: #1a1a1a;
    --login-okd-color-transparent-base-black: transparent;
    --login-okd-color-transparent-base-white: transparent;
    --login-okd-color-alert-base-info: #2e2e2e;
    --login-okd-color-alert-base-success: #002b1f;
    --login-okd-color-alert-base-warning: #361604;
    --login-okd-color-alert-base-error: #270b12;
    --login-okd-color-basil-5: #e9f4d1;
    --login-okd-color-basil-10: #d2e8a4;
    --login-okd-color-basil-20: #81be00;
    --login-okd-color-basil-30: #49a92d;
    --login-okd-color-basil-40: #2b6d17;
    --login-okd-color-basil-50: #1a410e;
    --login-okd-color-basil-60: #1a2600;
    --login-okd-color-rose-5: #ffdfe9;
    --login-okd-color-rose-10: #ffc0d3;
    --login-okd-color-rose-20: #ff5eb6;
    --login-okd-color-rose-30: #fc46ab;
    --login-okd-color-rose-40: #a54162;
    --login-okd-color-rose-50: #532131;
    --login-okd-color-rose-60: #2a111f;
    --login-okd-color-neutral-15: #f6f6f6;
    --login-okd-color-neutral-185: #121212;
    --login-okd-color-background-base-primary: #000;
    --login-okd-color-background-base-secondary: #121212;
    --login-okd-color-background-surface-primary: #1d1d1d;
    --login-okd-color-background-surface-secondary: #121212;
    --login-okd-color-background-surface-pressed: #383838;
    --login-okd-color-background-surface-disable: #0e0e0e;
    --login-okd-color-background-scrim: rgba(0,0,0,.68);
    --login-okd-color-container-primary: #272727;
    --login-okd-color-container-secondary: #272727;
    --login-okd-color-container-tertiary: #383838;
    --login-okd-color-container-contrast: #414141;
    --login-okd-color-container-inverse: #fafafa;
    --login-okd-color-content-primary: #fff;
    --login-okd-color-content-secondary: #e6e6e6;
    --login-okd-color-content-tertiary: #b3b3b3;
    --login-okd-color-content-contrast: #909090;
    --login-okd-color-content-disabled: #5b5b5b;
    --login-okd-color-content-inverse: #000;
    --login-okd-color-border-primary: #383838;
    --login-okd-color-border-secondary: #4d4d4d;
    --login-okd-color-border-contrast: #000;
    --login-okd-color-border-selected: #fff;
    --login-okd-color-semantic-neutral: #fff;
    --login-okd-color-semantic-notice: #ffb117;
    --login-okd-color-semantic-positive: #25a750;
    --login-okd-color-semantic-negative: #ca3f64;
    --login-okd-color-semantic-informative: #8a91ff;
    --login-okd-color-semantic-highlight: #bcff2f;
    --login-okd-color-dvp-neutral: hsla(0,0%,100%,.76);
    --login-okd-color-dvp-profit: #25a750;
    --login-okd-color-dvp-loss: #ca3f64;
    --login-okd-color-categorical-01: #5f62ff;
    --login-okd-color-categorical-02: #ffb117;
    --login-okd-color-categorical-03: #bcff2f;
    --login-okd-color-categorical-04: #00bc4b;
    --login-okd-color-categorical-05: #f5384f;
    --login-okd-color-transparent-white: transparent;
    --login-okd-color-transparent-black: hsla(0,0%,100%,.02);
    --login-okd-color-common-transparent: hsla(0,0%,100%,0);
    --login-okd-color-container-lv2: #1a1a1a;
    --login-okd-color-alert-info: #2e2e2e;
    --login-okd-color-alert-success: #002b1f;
    --login-okd-color-alert-warning: #361604;
    --login-okd-color-alert-error: #270b12;
    --login-okd-color-common-background-2: #383838;
    --login-okd-color-data-visualization-category-01: #5f62ff;
    --login-okd-color-data-visualization-category-02: #ffb117;
    --login-okd-color-data-visualization-category-03: #bcff2f;
    --login-okd-color-data-visualization-category-04: #00bc4b;
    --login-okd-color-data-visualization-category-05: #f5384f;
    --login-okd-color-preference-loss: #ca3f64;
    --login-okd-color-preference-profit: #25a750;
    --login-okd-color-preference-neutral: hsla(0,0%,100%,.76);
    --login-okd-color-border-focus: #fff;
    --login-okd-color-background-base-primaryAlternative: #000;
    --login-okd-color-link-content: #8a91ff;
    --login-okd-color-link-accent-content-primary: #bcff2f;
    --login-okd-color-background-surface-contrast: #272727;
    --login-okd-color-background-surface-brand: #bcff2f;
    --login-okd-color-border-tertiary: #0e0e0e;
    --login-okd-color-content-brand: #bcff2f;
    --login-okd-color-modal-primary: #0e0e0e;
    --login-okd-color-modal-secondary: #272727;
    --login-okd-color-modal-tertiary: #383838;
    --login-okd-color-modal-contrast: #4d4d4d;
    --login-okd-color-card-primary: #0e0e0e;
    --login-okd-color-card-secondary: #121212;
    --login-okd-color-brand-primary: #121212;
    --login-okd-color-brand-primary-alternative: #bcff2f;
    --login-okd-color-brand-secondary: #272727;
    --login-okd-color-brand-tertiary: #383838;
    --login-okd-color-brand-content: #e6ffb0;
    --login-okd-color-brand-content-contrast: #000;
    --login-okd-font-size-base: 16px;
    --login-okd-font-size-md: 14px;
    --login-okd-font-size-xs: 12px;
    --login-okd-line-height-base: 20px;
    --login-okd-line-height-md: 20px;
    --login-okd-line-height-xs: 16px;
    --login-okd-shadow-none: 0 0 0 0 transparent;
    --login-okd-shadow-xs: 0 0 0 1px #0000000d;
    --login-okd-shadow-sm: 0 1px 2px 0 #0000000d;
    --login-okd-shadow-default: 0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;
    --login-okd-shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;
    --login-okd-shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;
    --login-okd-shadow-xl: 0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;
    --login-okd-shadow-2xl: 0 25px 50px -12px #00000040;
    --login-okd-border-radius-none: 0;
    --login-okd-border-radius-sm: 2px;
    --login-okd-border-radius-md: 4px;
    --login-okd-border-radius-lg: 6px;
    --login-okd-border-radius-xl: 8px;
    --login-okd-border-radius-xxl: 10px;
    --login-okd-border-radius-xxxl: 12px;
    --login-okd-font-family: HarmonyOS Sans,SF Pro Text,SF Pro Icons,Arial,Helvetica Neue,Helvetica,sans-serif;
    --login-okd-text-display-lg-font-size: 56px;
    --login-okd-text-display-lg-font-weight: 500;
    --login-okd-text-display-lg-line-height: 1.32;
    --login-okd-text-display-md-font-size: 40px;
    --login-okd-text-display-md-font-weight: 500;
    --login-okd-text-display-md-line-height: 52px;
    --login-okd-text-display-sm-font-size: 40px;
    --login-okd-text-display-sm-font-weight: 500;
    --login-okd-text-display-sm-line-height: 52px;
    --login-okd-text-heading-lg-font-size: 30px;
    --login-okd-text-heading-lg-font-weight: 500;
    --login-okd-text-heading-lg-line-height: 40px;
    --login-okd-text-heading-md-font-size: 24px;
    --login-okd-text-heading-md-font-weight: 500;
    --login-okd-text-heading-md-line-height: 30px;
    --login-okd-text-heading-sm-font-size: 18px;
    --login-okd-text-heading-sm-font-weight: 500;
    --login-okd-text-heading-sm-line-height: 24px;
    --login-okd-text-heading-xl-font-size: 36px;
    --login-okd-text-heading-xl-line-height: 1.32;
    --login-okd-text-heading-xl-font-weight: 600;
    --login-okd-text-heading-xxl-font-size: 40px;
    --login-okd-text-heading-xxl-line-height: 1.32;
    --login-okd-text-heading-xxl-font-weight: 600;
    --login-okd-text-heading-overline-font-size: 12px;
    --login-okd-text-heading-overline-line-height: 15px;
    --login-okd-text-heading-overline-font-weight: 500;
    --login-okd-text-body-sm-regular-font-size: 14px;
    --login-okd-text-body-sm-regular-font-weight: 400;
    --login-okd-text-body-sm-regular-line-height: 21px;
    --login-okd-text-body-sm-bold-font-size: 14px;
    --login-okd-text-body-sm-bold-font-weight: 500;
    --login-okd-text-body-sm-bold-line-height: 21px;
    --login-okd-text-body-md-regular-font-size: 16px;
    --login-okd-text-body-md-regular-font-weight: 400;
    --login-okd-text-body-md-regular-line-height: 24px;
    --login-okd-text-body-md-bold-font-size: 16px;
    --login-okd-text-body-md-bold-font-weight: 500;
    --login-okd-text-body-md-bold-line-height: 24px;
    --login-okd-text-body-xs-regular-font-size: 12px;
    --login-okd-text-body-xs-regular-font-weight: 400;
    --login-okd-text-body-xs-regular-line-height: 18px;
    --login-okd-text-body-xs-bold-font-size: 12px;
    --login-okd-text-body-xs-bold-font-weight: 500;
    --login-okd-text-body-xs-bold-line-height: 18px;
    --login-okd-font-weight-400: 400;
    --login-okd-font-weight-500: 500;
    --login-okd-font-weight-600: 600;
    --login-okd-font-weight-700: 700;
    --login-okd-font-weight-800: 800;
    --login-okd-font-weight-900: 900;
    --login-okd-font-weight-regular: 400;
    --login-okd-font-weight-medium: 500;
    --login-okd-font-weight-bold: 700
}

.theme-okcoin {
    --login-okd-color-gray-050: #fbfbfc;
    --login-okd-color-gray-100: #f4f3f5;
    --login-okd-color-gray-300: #cbcad0;
    --login-okd-color-gray-400: #aaa9b3;
    --login-okd-color-gray-500: #898697;
    --login-okd-color-gray-600: #6d697f;
    --login-okd-color-gray-700: #4f495f;
    --login-okd-color-gray-800: #383243;
    --login-okd-color-gray-900: #1a1722;
    --login-okd-color-blue-050: #00000000;
    --login-okd-color-blue-100: #edf3fc;
    --login-okd-color-blue-200: #cce0fc;
    --login-okd-color-blue-300: #b3ccee;
    --login-okd-color-blue-400: #8aacd8;
    --login-okd-color-blue-500: #578bc2;
    --login-okd-color-blue-600: #436d9a;
    --login-okd-color-blue-700: #2f4f70;
    --login-okd-color-blue-800: #163756;
    --login-okd-color-blue-900: #001d20;
    --login-okd-color-green-050: #00000000;
    --login-okd-color-green-100: #d8faed;
    --login-okd-color-green-200: #93f0d1;
    --login-okd-color-green-300: #73dcba;
    --login-okd-color-green-400: #3bbe98;
    --login-okd-color-green-500: #009a78;
    --login-okd-color-green-600: #00795e;
    --login-okd-color-green-700: #1a5745;
    --login-okd-color-green-800: #1a3c31;
    --login-okd-color-green-900: #0c1c17;
    --login-okd-color-red-050: #00000000;
    --login-okd-color-red-100: #feefee;
    --login-okd-color-red-200: #fcd5d3;
    --login-okd-color-red-300: #fdbab2;
    --login-okd-color-red-400: #fc8978;
    --login-okd-color-red-500: #f15022;
    --login-okd-color-red-600: #c33900;
    --login-okd-color-red-700: #8f2800;
    --login-okd-color-red-800: #671900;
    --login-okd-color-red-900: #360a00;
    --login-okd-color-orange-050: #00000000;
    --login-okd-color-orange-100: #fef1e1;
    --login-okd-color-orange-200: #ffd99f;
    --login-okd-color-orange-300: #fac13c;
    --login-okd-color-orange-400: #d6a100;
    --login-okd-color-orange-500: #aa8225;
    --login-okd-color-orange-600: #86661c;
    --login-okd-color-orange-700: #624911;
    --login-okd-color-orange-800: #453309;
    --login-okd-color-orange-900: #221702;
    --login-okd-color-yellow-050: #00000000;
    --login-okd-color-yellow-100: #f2f7c6;
    --login-okd-color-yellow-200: #dde66e;
    --login-okd-color-yellow-300: #c9d300;
    --login-okd-color-yellow-400: #a9b11e;
    --login-okd-color-yellow-500: #878e00;
    --login-okd-color-yellow-600: #6a7000;
    --login-okd-color-yellow-700: #4c5108;
    --login-okd-color-yellow-800: #363804;
    --login-okd-color-yellow-900: #191b01;
    --login-okd-color-text-white: #fff;
    --login-okd-color-text-black: #080013;
    --login-okd-color-background-1: #fff;
    --login-okd-color-background-2: #181e2a;
    --login-okd-color-transparent: transparent;
    --login-okd-color-white: #fff;
    --login-okd-color-black: #000;
    --login-okd-color-gray-200: #dedde1;
    --login-okd-color-pink-100: #fdf0f3;
    --login-okd-color-pink-300: #f8bace;
    --login-okd-color-pink-400: #f985b1;
    --login-okd-color-pink-500: #f14190;
    --login-okd-color-pink-600: #c32a72;
    --login-okd-color-pink-700: #901c53;
    --login-okd-color-pink-800: #67123a;
    --login-okd-color-pink-900: #36051c;
    --login-okd-color-purple-100: #f4f1fd;
    --login-okd-color-purple-200: #e2dafa;
    --login-okd-color-purple-300: #cfc3f6;
    --login-okd-color-purple-400: #b49bf8;
    --login-okd-color-purple-500: #996cf9;
    --login-okd-color-purple-600: #7e49e0;
    --login-okd-color-purple-700: #5e2bb3;
    --login-okd-color-purple-800: #431c81;
    --login-okd-color-purple-900: #210a44;
    --login-okd-color-purple-1000: #080013;
    --login-okd-color-cyan-100: #ddf8fc;
    --login-okd-color-cyan-200: #a9e9f1;
    --login-okd-color-cyan-300: #89d6e1;
    --login-okd-color-cyan-400: #4bb8c6;
    --login-okd-color-cyan-500: #0096a3;
    --login-okd-color-cyan-600: #007681;
    --login-okd-color-cyan-700: #00565d;
    --login-okd-color-cyan-800: #023c42;
    --login-okd-color-cyan-900: #001d20;
    --login-okd-color-pink-200: #fad5de;
    --login-okd-font-size-base: 16px;
    --login-okd-font-size-md: 14px;
    --login-okd-font-size-xs: 12px;
    --login-okd-line-height-base: 20px;
    --login-okd-line-height-md: 20px;
    --login-okd-line-height-xs: 16px;
    --login-okd-shadow-none: 0 0 0 0 transparent;
    --login-okd-shadow-xs: 0 0 0 1px #0000000d;
    --login-okd-shadow-sm: 0 1px 2px 0 #0000000d;
    --login-okd-shadow-default: 0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;
    --login-okd-shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;
    --login-okd-shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;
    --login-okd-shadow-xl: 0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;
    --login-okd-shadow-2xl: 0 25px 50px -12px #00000040;
    --login-okd-border-radius-none: 0;
    --login-okd-border-radius-sm: 4px;
    --login-okd-border-radius-md: 8px;
    --login-okd-border-radius-lg: 12px;
    --login-okd-border-radius-xl: 16px;
    --login-okd-border-radius-xxl: 24px;
    --login-okd-border-radius-xxxl: 32px;
    --login-okd-font-family: galano-okcoin,sans-serif;
    --login-okd-text-display-lg-font-size: 56px;
    --login-okd-text-display-lg-font-weight: 500;
    --login-okd-text-display-lg-line-height: 1.32;
    --login-okd-text-display-md-font-size: 40px;
    --login-okd-text-display-md-font-weight: 500;
    --login-okd-text-display-md-line-height: 52px;
    --login-okd-text-display-sm-font-size: 40px;
    --login-okd-text-display-sm-font-weight: 500;
    --login-okd-text-display-sm-line-height: 52px;
    --login-okd-text-heading-lg-font-size: 30px;
    --login-okd-text-heading-lg-font-weight: 500;
    --login-okd-text-heading-lg-line-height: 40px;
    --login-okd-text-heading-md-font-size: 24px;
    --login-okd-text-heading-md-font-weight: 500;
    --login-okd-text-heading-md-line-height: 30px;
    --login-okd-text-heading-sm-font-size: 18px;
    --login-okd-text-heading-sm-font-weight: 500;
    --login-okd-text-heading-sm-line-height: 24px;
    --login-okd-text-heading-xl-font-size: 36px;
    --login-okd-text-heading-xl-font-weight: 600;
    --login-okd-text-heading-xl-line-height: 1.32;
    --login-okd-text-heading-xxl-font-size: 40px;
    --login-okd-text-heading-xxl-font-weight: 600;
    --login-okd-text-heading-xxl-line-height: 1.32;
    --login-okd-text-heading-overline-font-size: 12px;
    --login-okd-text-heading-overline-line-height: 15px;
    --login-okd-text-heading-overline-font-weight: 500;
    --login-okd-text-body-sm-regular-font-size: 14px;
    --login-okd-text-body-sm-regular-font-weight: 400;
    --login-okd-text-body-sm-regular-line-height: 21px;
    --login-okd-text-body-sm-bold-font-size: 14px;
    --login-okd-text-body-sm-bold-font-weight: 500;
    --login-okd-text-body-sm-bold-line-height: 21px;
    --login-okd-text-body-md-regular-font-size: 16px;
    --login-okd-text-body-md-regular-font-weight: 400;
    --login-okd-text-body-md-regular-line-height: 24px;
    --login-okd-text-body-md-bold-font-size: 16px;
    --login-okd-text-body-md-bold-font-weight: 500;
    --login-okd-text-body-md-bold-line-height: 24px;
    --login-okd-text-body-xs-regular-font-size: 12px;
    --login-okd-text-body-xs-regular-font-weight: 400;
    --login-okd-text-body-xs-regular-line-height: 18px;
    --login-okd-text-body-xs-bold-font-size: 12px;
    --login-okd-text-body-xs-bold-font-weight: 500;
    --login-okd-text-body-xs-bold-line-height: 18px;
    --login-okd-font-weight-400: 400;
    --login-okd-font-weight-500: 500;
    --login-okd-font-weight-600: 600;
    --login-okd-font-weight-700: 700;
    --login-okd-font-weight-800: 800;
    --login-okd-font-weight-900: 900;
    --login-okd-font-weight-regular: 400;
    --login-okd-font-weight-medium: 500;
    --login-okd-font-weight-bold: 700
}

.login-a11y-button:focus-visible {
    border-radius: 4px;
    outline: 2px solid var(--login-okd-color-border-focus);
    outline-color: var(--login-okd-color-border-focus);
    outline-offset: 2px;
    outline-style: solid;
    outline-width: 2px
}

.login-icon.icon {
    font-family: var(--ok-icon-font-family)!important
}


.theme-light,:root{--login-okd-dialog-window-background:var(--login-okd-color-modal-primary);--login-okd-dialog-window-mask-color:var(--login-okd-color-background-scrim);--login-okd-dialog-window-box-shadow:var(--login-okd-shadow-xl);--login-okd-dialog-window-default-text-color:var(--login-okd-color-content-primary);--login-okd-dialog-window-border-radius:8px;--login-okd-dialog-window-close-btn-color:var(--login-okd-color-content-contrast);--login-okd-dialog-window-close-size:32px;--login-okd-dialog-window-split-line-border-color:var(--login-okd-color-border-primary);--login-okd-dialog-tip-window-min-width:344px;--login-okd-dialog-tip-window-2btn-min-width:448px;--login-okd-dialog-title-color:var(--login-okd-color-content-primary);--login-okd-dialog-title-font-size:16px;--login-okd-dialog-title-line-height:20px;--login-okd-dialog-title-box-sm-padding-vertical:14px;--login-okd-dialog-title-box-md-padding-vertical:12px;--login-okd-dialog-sub-title-color:var(--login-okd-color-content-contrast);--login-okd-dialog-sub-title-font-size:14px;--login-okd-dialog-sub-title-line-height:16px;--login-okd-dialog-tip-title-color:var(--login-okd-color-gray-900);--login-okd-dialog-tip-title-font-size:18px;--login-okd-dialog-tip-title-line-height:24px;--login-okd-dialog-tip-detail-color:var(--login-okd-color-gray-700);--login-okd-dialog-tip-detail-font-size:14px;--login-okd-dialog-tip-detail-line-height:20px;--login-okd-dialog-tip-success-icon-bg:var(--login-okd-color-semantic-positive);--login-okd-dialog-tip-info-icon-bg:var(--login-okd-color-semantic-neutral);--login-okd-dialog-tip-prompt-icon-bg:rgba(241,101,20,.2);--login-okd-dialog-tip-warn-icon-bg:var(--login-okd-color-semantic-notice);--login-okd-dialog-tip-alert-icon-bg:rgba(241,80,123,.2);--login-okd-dialog-tip-error-icon-bg:var(--login-okd-color-semantic-negative);--login-okd-dialog-tip-success-icon-color:var(--login-okd-color-semantic-positive);--login-okd-dialog-tip-info-icon-color:var(--login-okd-color-semantic-neutral);--login-okd-dialog-tip-prompt-icon-color:var(--login-okd-color-orange-700);--login-okd-dialog-tip-warn-icon-color:var(--login-okd-color-semantic-notice);--login-okd-dialog-tip-alert-icon-color:var(--login-okd-color-fq-red-lv1);--login-okd-dialog-tip-error-icon-color:var(--login-okd-color-semantic-negative);--login-okd-dialog-tip-icon-bg-size:48px;--login-okd-dialog-tip-icon-font-size:48px;--login-okd-dialog-action-close-btn-color:var(--login-okd-color-blue-700);--login-okd-dialog-footer-box-sm-padding-vertical:20px;--login-okd-dialog-footer-box-md-padding-vertical:12px;--login-okd-dialog-tip-footer-box-sm-padding-vertical:16px;--login-okd-dialog-tip-footer-box-md-padding-vertical:24px;--login-okd-dialog-container-sm-padding-horizontal:16px;--login-okd-dialog-container-md-padding-horizontal:24px;--login-okd-dialog-container-md-padding-vertical:24px;--login-okd-dialog-container-sm-padding-vertical:16px;--login-okd-dialog-window-close-icon-size:24px;--login-okd-dialog-window-back-icon-size:24px;--login-okd-dialog-tip-container-md-padding-top:28px;--login-okd-dialog-tip-container-md-padding-bottom:24px;--login-okd-dialog-tip-container-sm-padding-top:20px;--login-okd-dialog-tip-container-sm-padding-bottom:24px;--login-okd-dialog-window-action-padding:16px;--login-okd-dialog-footer-action-cancel-type:secondary;--login-okd-dialog-footer-action-confirm-type:highlight;--login-okd-dialog-footer-action-cancel-size:sm;--login-okd-dialog-footer-action-confirm-size:sm;--login-okd-dialog-window-sm-border-radius:12px;--login-okd-dialog-title-font-weight:700;--login-okd-dialog-footer-btn-full-sm-margin-top:8px;--login-okd-dialog-footer-btn-md-margin-left:12px;--login-okd-dialog-footer-btn-sm-margin-left:12px;--login-okd-dialog-confirm-footer-sm-button-border-color:var(--login-okd-color-border-primary);--login-okd-dialog-confirm-footer-padding-top:0;--login-okd-dialog-confirm-footer-padding-bottom:24px;--login-okd-dialog-confirm-title-padding-top:24px;--login-okd-dialog-confirm-no-title-padding-top:24px;--login-okd-dialog-confirm-title-padding-bottom:0px;--login-okd-dialog-confirm-max-width:520px;--login-okd-dialog-confirm-min-width:280px;--login-okd-dialog-confirm-container-color:var(--login-okd-color-content-secondary);--login-okd-dialog-confirm-container-line-height:20px;--login-okd-dialog-confirm-container-font-size:14px;--login-okd-dialog-confirm-container-sm-padding-bottom:24px;--login-okd-dialog-confirm-icon-font-size:22px;--login-okd-dialog-confirm-icon-margin-right:10px;--login-okd-dialog-confirm-icon-line-height:22px;--login-okd-dialog-title-icon-close-color:var(--login-okd-color-content-contrast);--login-okd-dialog-title-icon-back-color:var(--login-okd-color-content-primary);--login-okd-dialog-title-icon-close-hover-color:var(--login-okd-color-content-primary);--login-okd-dialog-title-icon-hover-background-color:hsla(0,0%,95%,0);--login-okd-dialog-title-icon-hover-border-radius:4px;--login-okd-dialog-title-icon-close-margin-left:32px;--login-okd-dialog-title-icon-back-margin-right:8px;--login-okd-dialog-window-back-btn-color:var(--login-okd-color-container-inverse);--login-okd-dialog-window-back-btn-margin-right:12px;--login-okd-dialog-window-close-btn-margin-left:12px;--login-okd-dialog-confirm-container-sm-padding-top:8px;--login-okd-dialog-confirm-container-sm-padding-horizontal:24px;--login-okd-dialog-confirm-title-padding-horizontal:24px;--login-okd-dialog-footer-box-sm-padding-top:12px;--login-okd-dialog-footer-box-sm-padding-bottom:20px;--login-okd-dialog-confirmation-header-padding-top:24px;--login-okd-dialog-confirmation-footer-padding-bottom:24px;--login-okd-dialog-confirmation-padding-left:24px;--login-okd-dialog-confirmation-padding-right:24px;--login-okd-dialog-confirmation-container-padding-top:32px;--login-okd-dialog-confirmation-container-padding-bottom:32px;--login-okd-dialog-confirm-footer-sm-button-color:var(--login-okd-color-content-primary);--login-okd-dialog-window-min-width:392px;--login-okd-dialog-confirm-container-padding-top:32px;--login-okd-dialog-confirm-container-padding-bottom:32px;--login-okd-dialog-confirm-window-background:var(--login-okd-color-modal-tertiary);--login-okd-dialog-confirmation-window-background:var(--login-okd-color-modal-primary);--login-okd-dialog-window-border-color:var(--login-okd-color-border-primary)}.theme-dark{--login-okd-dialog-window-background:var(--login-okd-color-modal-primary);--login-okd-dialog-window-close-btn-color:var(--login-okd-color-content-contrast);--login-okd-dialog-window-split-line-border-color:var(--login-okd-color-border-primary);--login-okd-dialog-title-color:var(--login-okd-color-content-primary);--login-okd-dialog-sub-title-color:var(--login-okd-color-content-contrast);--login-okd-dialog-window-mask-color:var(--login-okd-color-background-scrim);--login-okd-dialog-window-default-text-color:var(--login-okd-color-content-primary);--login-okd-dialog-window-box-shadow:0px 0px 0px 0px #2e2e2e,0px 13px 20px -15px #000;--login-okd-dialog-tip-title-color:var(--login-okd-color-gray-900);--login-okd-dialog-tip-detail-color:var(--login-okd-color-gray-700);--login-okd-dialog-tip-success-icon-bg:var(--login-okd-color-semantic-positive);--login-okd-dialog-tip-info-icon-bg:var(--login-okd-color-semantic-neutral);--login-okd-dialog-tip-prompt-icon-bg:var(--login-okd-color-orange-100);--login-okd-dialog-tip-warn-icon-bg:var(--login-okd-color-semantic-notice);--login-okd-dialog-tip-alert-icon-bg:var(--login-okd-color-red-100);--login-okd-dialog-tip-error-icon-bg:var(--login-okd-color-semantic-negative);--login-okd-dialog-tip-success-icon-color:var(--login-okd-color-semantic-positive);--login-okd-dialog-tip-info-icon-color:var(--login-okd-color-semantic-neutral);--login-okd-dialog-tip-prompt-icon-color:var(--login-okd-color-orange-800);--login-okd-dialog-tip-warn-icon-color:var(--login-okd-color-semantic-notice);--login-okd-dialog-tip-alert-icon-color:var(--login-okd-color-fq-critical);--login-okd-dialog-tip-error-icon-color:var(--login-okd-color-semantic-negative);--login-okd-dialog-tip-icon-bg-size:48px;--login-okd-dialog-tip-icon-font-size:48px;--login-okd-dialog-tip-title-font-size:18px;--login-okd-dialog-tip-title-line-height:24px;--login-okd-dialog-tip-detail-font-size:14px;--login-okd-dialog-tip-detail-line-height:20px;--login-okd-dialog-action-close-btn-color:var(--login-okd-color-blue-700);--login-okd-dialog-window-border-radius:8px;--login-okd-dialog-title-font-size:16px;--login-okd-dialog-title-line-height:20px;--login-okd-dialog-sub-title-font-size:var(--login-okd-font-size-md);--login-okd-dialog-sub-title-line-height:16px;--login-okd-dialog-window-close-size:32px;--login-okd-dialog-container-sm-padding-horizontal:16px;--login-okd-dialog-title-box-sm-padding-vertical:14px;--login-okd-dialog-container-sm-padding-vertical:16px;--login-okd-dialog-footer-box-sm-padding-vertical:12px;--login-okd-dialog-container-md-padding-horizontal:24px;--login-okd-dialog-title-box-md-padding-vertical:12px;--login-okd-dialog-container-md-padding-vertical:24px;--login-okd-dialog-footer-box-md-padding-vertical:12px;--login-okd-dialog-tip-window-min-width:344px;--login-okd-dialog-tip-window-2btn-min-width:448px;--login-okd-dialog-tip-footer-box-sm-padding-vertical:16px;--login-okd-dialog-tip-footer-box-md-padding-vertical:24px;--login-okd-dialog-window-close-icon-size:24px;--login-okd-dialog-window-back-icon-size:24px;--login-okd-dialog-tip-container-md-padding-top:28px;--login-okd-dialog-tip-container-md-padding-bottom:24px;--login-okd-dialog-tip-container-sm-padding-top:20px;--login-okd-dialog-tip-container-sm-padding-bottom:24px;--login-okd-dialog-window-action-padding:16px;--login-okd-dialog-footer-action-cancel-type:primary;--login-okd-dialog-footer-action-cancel-size:sm;--login-okd-dialog-footer-action-confirm-type:highlight;--login-okd-dialog-footer-action-confirm-size:sm;--login-okd-dialog-window-sm-border-radius:12px;--login-okd-dialog-title-font-weight:700;--login-okd-dialog-footer-btn-full-sm-margin-top:8px;--login-okd-dialog-footer-btn-md-margin-left:12px;--login-okd-dialog-footer-btn-sm-margin-left:12px;--login-okd-dialog-confirm-footer-sm-button-border-color:var(--login-okd-color-border-secondary);--login-okd-dialog-confirm-footer-padding-top:0;--login-okd-dialog-confirm-footer-padding-bottom:24px;--login-okd-dialog-confirm-title-padding-top:24px;--login-okd-dialog-confirm-no-title-padding-top:24px;--login-okd-dialog-confirm-title-padding-bottom:0;--login-okd-dialog-confirm-max-width:520px;--login-okd-dialog-confirm-min-width:280px;--login-okd-dialog-confirm-container-color:var(--login-okd-color-content-secondary);--login-okd-dialog-confirm-container-line-height:20px;--login-okd-dialog-confirm-container-font-size:14px;--login-okd-dialog-confirm-container-sm-padding-bottom:24px;--login-okd-dialog-confirm-icon-font-size:22px;--login-okd-dialog-confirm-icon-margin-right:10px;--login-okd-dialog-confirm-icon-line-height:22px;--login-okd-dialog-title-icon-close-color:var(--login-okd-color-content-contrast);--login-okd-dialog-title-icon-back-color:var(--login-okd-color-content-primary);--login-okd-dialog-title-icon-close-hover-color:var(--login-okd-color-content-primary);--login-okd-dialog-title-icon-hover-background-color:rgba(29,29,29,0);--login-okd-dialog-title-icon-hover-border-radius:4px;--login-okd-dialog-title-icon-close-margin-left:32px;--login-okd-dialog-title-icon-back-margin-right:8px;--login-okd-dialog-confirm-container-sm-padding-top:8px;--login-okd-dialog-confirm-container-sm-padding-horizontal:24px;--login-okd-dialog-confirm-title-padding-horizontal:24px;--login-okd-dialog-footer-box-sm-padding-top:12px;--login-okd-dialog-footer-box-sm-padding-bottom:20px;--login-okd-dialog-confirmation-header-padding-top:24px;--login-okd-dialog-confirmation-footer-padding-bottom:24px;--login-okd-dialog-confirmation-padding-left:24px;--login-okd-dialog-confirmation-padding-right:24px;--login-okd-dialog-confirmation-container-padding-top:32px;--login-okd-dialog-confirmation-container-padding-bottom:32px;--login-okd-dialog-confirm-footer-sm-button-color:var(--login-okd-color-content-primary);--login-okd-dialog-window-min-width:392px;--login-okd-dialog-window-back-btn-color:var(--login-okd-color-container-inverse);--login-okd-dialog-confirm-container-padding-top:32px;--login-okd-dialog-confirm-container-padding-bottom:32px;--login-okd-dialog-confirm-window-background:var(--login-okd-color-modal-tertiary);--login-okd-dialog-confirmation-window-background:var(--login-okd-color-modal-primary);--login-okd-dialog-window-border-color:var(--login-okd-color-border-primary)}.theme-okcoin{--login-okd-dialog-window-background:var(--login-okd-color-background-1);--login-okd-dialog-window-close-btn-color:var(--login-okd-color-gray-600);--login-okd-dialog-window-split-line-border-color:var(--login-okd-color-gray-100);--login-okd-dialog-title-color:var(--login-okd-color-purple-1000);--login-okd-dialog-sub-title-color:var(--login-okd-color-gray-600);--login-okd-dialog-window-mask-color:hsla(270,9%,96%,.75);--login-okd-dialog-window-default-text-color:var(--login-okd-color-gray-700);--login-okd-dialog-window-box-shadow:var(--login-okd-shadow-xl);--login-okd-dialog-tip-title-color:var(--login-okd-color-gray-900);--login-okd-dialog-tip-detail-color:var(--login-okd-color-gray-700);--login-okd-dialog-tip-success-icon-bg:var(--login-okd-color-green-100);--login-okd-dialog-tip-info-icon-bg:var(--login-okd-color-blue-100);--login-okd-dialog-tip-prompt-icon-bg:var(--login-okd-color-orange-100);--login-okd-dialog-tip-warn-icon-bg:var(--login-okd-color-orange-100);--login-okd-dialog-tip-alert-icon-bg:var(--login-okd-color-red-100);--login-okd-dialog-tip-error-icon-bg:var(--login-okd-color-red-100);--login-okd-dialog-tip-success-icon-color:var(--login-okd-color-green-800);--login-okd-dialog-tip-info-icon-color:var(--login-okd-color-blue-800);--login-okd-dialog-tip-prompt-icon-color:var(--login-okd-color-orange-800);--login-okd-dialog-tip-warn-icon-color:var(--login-okd-color-orange-800);--login-okd-dialog-tip-alert-icon-color:var(--login-okd-color-red-800);--login-okd-dialog-tip-error-icon-color:var(--login-okd-color-red-800);--login-okd-dialog-tip-icon-bg-size:48px;--login-okd-dialog-tip-icon-font-size:48px;--login-okd-dialog-tip-title-font-size:18px;--login-okd-dialog-tip-title-line-height:24px;--login-okd-dialog-tip-detail-font-size:14px;--login-okd-dialog-tip-detail-line-height:20px;--login-okd-dialog-action-close-btn-color:var(--login-okd-color-blue-700);--login-okd-dialog-window-border-radius:var(--login-okd-border-radius-md);--login-okd-dialog-title-font-size:16px;--login-okd-dialog-title-line-height:20px;--login-okd-dialog-sub-title-font-size:var(--login-okd-font-size-md);--login-okd-dialog-sub-title-line-height:var(--login-okd-line-height-md);--login-okd-dialog-window-close-size:32px;--login-okd-dialog-container-sm-padding-horizontal:16px;--login-okd-dialog-title-box-sm-padding-vertical:14px;--login-okd-dialog-container-sm-padding-vertical:16px;--login-okd-dialog-footer-box-sm-padding-vertical:12px;--login-okd-dialog-container-md-padding-horizontal:24px;--login-okd-dialog-title-box-md-padding-vertical:12px;--login-okd-dialog-container-md-padding-vertical:24px;--login-okd-dialog-footer-box-md-padding-vertical:12px;--login-okd-dialog-window-min-width:392px;--login-okd-dialog-tip-window-min-width:344px;--login-okd-dialog-tip-window-2btn-min-width:448px;--login-okd-dialog-tip-footer-box-sm-padding-vertical:16px;--login-okd-dialog-tip-footer-box-md-padding-vertical:24px;--login-okd-dialog-window-close-icon-size:24px;--login-okd-dialog-window-back-icon-size:24px;--login-okd-dialog-tip-container-md-padding-top:24px;--login-okd-dialog-tip-container-md-padding-bottom:24px;--login-okd-dialog-tip-container-sm-padding-top:16px;--login-okd-dialog-tip-container-sm-padding-bottom:16px;--login-okd-dialog-window-action-padding:16px;--login-okd-dialog-footer-action-cancel-type:secondary;--login-okd-dialog-footer-action-cancel-size:sm;--login-okd-dialog-footer-action-confirm-type:primary;--login-okd-dialog-footer-action-confirm-size:sm;--login-okd-dialog-window-sm-border-radius:8px;--login-okd-dialog-title-font-weight:700;--login-okd-dialog-footer-btn-full-sm-margin-top:8px;--login-okd-dialog-footer-btn-md-margin-left:16px;--login-okd-dialog-footer-btn-sm-margin-left:12px;--login-okd-dialog-confirm-footer-sm-button-border-color:var(--login-okd-color-gray-100);--login-okd-dialog-confirm-footer-padding-top:0;--login-okd-dialog-confirm-footer-padding-bottom:24px;--login-okd-dialog-confirm-title-padding-top:24px;--login-okd-dialog-confirm-no-title-padding-top:24px;--login-okd-dialog-confirm-title-padding-bottom:0;--login-okd-dialog-confirm-max-width:520px;--login-okd-dialog-confirm-min-width:280px;--login-okd-dialog-confirm-container-color:#000;--login-okd-dialog-confirm-container-line-height:20px;--login-okd-dialog-confirm-container-font-size:14px;--login-okd-dialog-confirm-container-sm-padding-bottom:24px;--login-okd-dialog-confirm-icon-font-size:22px;--login-okd-dialog-confirm-icon-margin-right:10px;--login-okd-dialog-confirm-icon-line-height:22px;--login-okd-dialog-title-icon-close-color:var(--login-okd-color-gray-400);--login-okd-dialog-title-icon-back-color:var(--login-okd-color-gray-900);--login-okd-dialog-title-icon-close-hover-color:var(--login-okd-color-gray-900);--login-okd-dialog-title-icon-hover-background-color:var(--login-okd-color-background-hover);--login-okd-dialog-title-icon-hover-border-radius:4px;--login-okd-dialog-title-icon-close-margin-left:32px;--login-okd-dialog-title-icon-back-margin-right:16px;--login-okd-dialog-confirm-container-sm-padding-top:8px;--login-okd-dialog-confirm-container-sm-padding-horizontal:24px;--login-okd-dialog-confirm-title-padding-horizontal:24px;--login-okd-dialog-footer-box-sm-padding-top:12px;--login-okd-dialog-footer-box-sm-padding-bottom:20px;--login-okd-dialog-confirmation-header-padding-top:24px;--login-okd-dialog-confirmation-footer-padding-bottom:24px;--login-okd-dialog-confirmation-padding-left:24px;--login-okd-dialog-confirmation-padding-right:24px;--login-okd-dialog-confirmation-container-padding-top:32px;--login-okd-dialog-confirmation-container-padding-bottom:32px;--login-okd-dialog-confirm-footer-sm-button-color:var(--login-okd-color-blue-800)}.login-mask{background:rgba(0,0,0,.65);background:var(--login-okd-dialog-window-mask-color,rgba(0,0,0,.65));bottom:0;left:0;position:fixed;right:0;top:0}.login-transition-fade{transition:opacity .3s linear}.login-transition-fade-active{will-change:opacity}.login-transition-fade-ease-out{transition-timing-function:cubic-bezier(.5,0,.52,1)}.login-transition-fade-entered,.login-transition-fade-entering{opacity:1}.login-transition-fade-exited,.login-transition-fade-exiting{opacity:0}.login-transition-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;perspective:1000px;position:fixed;transform:translateY(100%);transform-style:preserve-3d;transition:transform .3s linear,opacity .3s linear}.login-transition-slide-active{will-change:transform,opacity}.login-transition-slide-cubic{transition-timing-function:ease}.login-transition-slide-top{left:0;top:0;width:100%}.login-transition-slide-bottom{bottom:0;left:0;width:100%}.login-transition-slide-left{height:100%;left:0;top:0}.login-transition-slide-right{height:100%;right:0;top:0}.login-transition-slide-entered,.login-transition-slide-entering{opacity:1;transform:none}.login-transition-slide-exited,.login-transition-slide-exiting{opacity:0}.login-transition-slide-exited.login-transition-slide-top,.login-transition-slide-exiting.login-transition-slide-top{transform:translateY(-100%)}.login-transition-slide-exited.login-transition-slide-bottom,.login-transition-slide-exiting.login-transition-slide-bottom{transform:translateY(100%)}.login-transition-slide-exited.login-transition-slide-left,.login-transition-slide-exiting.login-transition-slide-left{transform:translateX(-100%)}.login-transition-slide-exited.login-transition-slide-right,.login-transition-slide-exiting.login-transition-slide-right{transform:translateX(100%)}@media (hover:none) and (pointer:coarse){.login-transition-slide{transition-duration:.2s}}.login-dialog{--inner-okd-dialog-close-btn-padding:var(--login-okd-dialog-window-action-fixed-padding,16px);height:100%;pointer-events:none;width:100%}.login-dialog-float{left:0;position:fixed;top:0}.login-dialog *{-webkit-tap-highlight-color:transparent;box-sizing:border-box}.login-dialog-window-float{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}@supports (bottom:constant(safe-area-inset-bottom)) or (bottom:env(safe-area-inset-bottom)){.login-dialog-window-safe{padding-bottom:env(safe-area-inset-bottom)}}.login-dialog-window{border-radius:var(--login-okd-dialog-window-border-radius);box-shadow:var(--login-okd-dialog-window-box-shadow);display:flex;flex-direction:column;margin-left:auto;margin-right:auto;max-height:calc(100% - 48px);outline:none;pointer-events:auto;width:calc(100% - 32px)}.login-dialog-window-border{border:1px solid transparent;border:1px solid var(--login-okd-dialog-window-border-color,transparent)}.login-dialog-title-container{align-items:center;display:flex;flex-direction:row;flex-shrink:0;justify-content:space-between}.login-dialog-title-container .title-center{text-align:center}.login-dialog-title-container .title-center .modal-title{justify-content:center}.login-dialog-title-block{display:flex;flex-direction:column;flex-grow:1}.login-dialog-title-block .modal-title{font-size:16px;font-size:var(--login-okd-dialog-title-font-size,16px);font-weight:700;font-weight:var(--login-okd-dialog-title-font-weight,700);line-height:var(--login-okd-dialog-title-line-height);padding-top:2px}.login-dialog-title-block .modal-sub-title{font-size:var(--login-okd-dialog-sub-title-font-size);font-weight:400;line-height:var(--login-okd-dialog-sub-title-line-height);margin-top:2px}.login-dialog-b-btn,.login-dialog-c-btn{cursor:pointer;display:inline-block;height:var(--login-okd-dialog-window-close-icon-size);justify-content:center;line-height:1;position:relative;vertical-align:middle;width:var(--login-okd-dialog-window-close-icon-size);z-index:1}.login-dialog-b-btn.icon,.login-dialog-c-btn.icon{font-size:var(--login-okd-dialog-window-close-icon-size)}.login-dialog-b-btn:after,.login-dialog-c-btn:after{content:" ";display:block;height:calc(var(--login-okd-dialog-window-close-icon-size)*1.5);left:-25%;position:absolute;top:-25%;width:calc(var(--login-okd-dialog-window-close-icon-size)*1.5)}.login-dialog-b-btn{height:var(--login-okd-dialog-window-back-icon-size);margin-right:16px;margin-right:var(--login-okd-dialog-title-icon-back-margin-right,16px);width:var(--login-okd-dialog-window-back-icon-size)}.login-dialog-b-btn.icon{font-size:var(--login-okd-dialog-window-back-icon-size)}.login-dialog-c-btn{margin-left:32px;margin-left:var(--login-okd-dialog-title-icon-close-margin-left,32px)}.login-dialog-top-action-fixed{padding:var(--inner-okd-dialog-close-btn-padding);position:absolute;top:0}.login-dialog-top-action-fixed .login-dialog-b-btn,.login-dialog-top-action-fixed .login-dialog-c-btn{margin:0}.login-dialog-top-l{align-self:flex-start;left:0}.login-dialog-top-r{align-self:flex-start;right:0}.login-dialog-top-hidden-for-t-center{pointer-events:none;visibility:hidden}.login-dialog-top-action-hidden{display:none;pointer-events:none}.login-dialog-scroll-box{flex-grow:1;overflow-y:auto}.login-dialog-scroll-box.scroll-disable{overflow-y:unset}.login-dialog-container,.login-dialog-customer-box{height:100%}.login-dialog-container.no-padding,.login-dialog-customer-box.no-padding{padding:0}.login-dialog .login-dialog-footer-line{border-top:thin solid var(--login-okd-dialog-window-split-line-border-color)}.login-dialog .login-dialog-header-line{border-bottom:thin solid var(--login-okd-dialog-window-split-line-border-color)}.login-dialog-btn-box{display:flex}.login-dialog-btn-box.layout-right{justify-content:flex-end}.login-dialog-btn-box.layout-left{justify-content:flex-start}.login-dialog-btn-box.layout-full .dialog-btn{flex:1 1}.login-dialog .login-dialog-window{background:var(--login-okd-dialog-window-background);color:var(--login-okd-dialog-window-default-text-color)}.login-dialog .login-dialog-window.container-mode{background:transparent;box-shadow:none}.login-dialog .login-dialog-title-container .modal-title{align-items:center;color:var(--login-okd-dialog-title-color);display:flex}.login-dialog .login-dialog-title-container .modal-sub-title{color:var(--login-okd-dialog-sub-title-color)}.login-dialog .login-dialog-c-btn{color:var(--login-okd-color-gray-400);color:var(--login-okd-dialog-title-icon-close-color,var(--login-okd-color-gray-400))}.login-dialog .login-dialog-c-btn:hover{background-color:var(--login-okd-color-background-hover);background-color:var(--login-okd-dialog-title-icon-hover-background-color,var(--login-okd-color-background-hover));border-radius:4px;border-radius:var(--login-okd-dialog-title-icon-hover-border-radius,4px);color:var(--login-okd-color-gray-900);color:var(--login-okd-dialog-title-icon-close-hover-color,var(--login-okd-color-gray-900))}.login-dialog .login-dialog-b-btn{color:var(--login-okd-color-gray-900);color:var(--login-okd-dialog-title-icon-back-color,var(--login-okd-color-gray-900))}.login-dialog .login-dialog-b-btn:hover{background-color:var(--login-okd-color-background-hover);background-color:var(--login-okd-dialog-title-icon-hover-background-color,var(--login-okd-color-background-hover));border-radius:4px;border-radius:var(--login-okd-dialog-title-icon-hover-border-radius,4px)}.login-dialog-mask{background:var(--login-okd-dialog-window-mask-color)}.login-dialog-scroll-bar-end::-webkit-scrollbar,.login-dialog-scroll-bar-start::-webkit-scrollbar{background-color:initial}.login-dialog-scroll-bar-start::-webkit-scrollbar-button:vertical:start:increment{background-color:initial;display:block;height:var(--login-okd-dialog-window-border-radius)}.login-dialog-scroll-bar-end::-webkit-scrollbar-button:vertical:end:increment{background-color:initial;display:block;height:var(--login-okd-dialog-window-border-radius)}@media (min-width:768px){.login-dialog-window{min-width:var(--login-okd-dialog-window-min-width);width:auto}.login-dialog-title-container{padding:var(--login-okd-dialog-title-box-md-padding-vertical) var(--login-okd-dialog-container-md-padding-horizontal)}.login-dialog-container{padding:var(--login-okd-dialog-container-md-padding-vertical) var(--login-okd-dialog-container-md-padding-horizontal)}.login-dialog-customer-box{padding:0 var(--login-okd-dialog-container-md-padding-horizontal)}.login-dialog-footer-box{padding:var(--login-okd-dialog-footer-box-md-padding-vertical) var(--login-okd-dialog-container-md-padding-horizontal)}.login-dialog-btn-box .dialog-btn.double-btn{width:auto}.login-dialog-btn-box.layout-full{flex-direction:row}.login-dialog-btn-box .dialog-btn+.dialog-btn{margin-left:16px;margin-left:var(--login-okd-dialog-footer-btn-md-margin-left,16px)}}@media (max-width:767px){.login-dialog-title-container{padding:var(--login-okd-dialog-title-box-sm-padding-vertical) var(--login-okd-dialog-container-sm-padding-horizontal)}.login-dialog-container{padding:var(--login-okd-dialog-container-sm-padding-vertical) var(--login-okd-dialog-container-sm-padding-horizontal)}.login-dialog-customer-box{padding:0 var(--login-okd-dialog-container-sm-padding-horizontal)}.login-dialog-footer-box{padding:var(--login-okd-dialog-footer-box-sm-padding-top,12px) var(--login-okd-dialog-container-sm-padding-horizontal) var(--login-okd-dialog-footer-box-sm-padding-bottom,20px)}.login-dialog-btn-box .dialog-btn{width:100%}.login-dialog-btn-box .dialog-btn+.dialog-btn{margin-left:12px;margin-left:var(--login-okd-dialog-footer-btn-sm-margin-left,12px)}.login-dialog-btn-box.layout-full{flex-direction:column-reverse}.login-dialog-btn-box.layout-full .dialog-btn+.dialog-btn{margin-left:0}.login-dialog-btn-box.layout-full .double-btn:first-child{margin-top:8px;margin-top:var(--login-okd-dialog-footer-btn-full-sm-margin-top,8px)}.login-dialog-window{border-radius:8px;border-radius:var(--login-okd-dialog-window-sm-border-radius,8px)}.login-dialog-window.full-page{height:auto!important;min-height:calc(100% - 48px)!important}.login-dialog-window.full-page-with-show-header{height:auto!important}.login-dialog-window.bottom-align{border-radius:var(--login-okd-dialog-window-border-radius) var(--login-okd-dialog-window-border-radius) 0 0;bottom:0;top:auto;transform:translate(-50%)}.login-dialog-window.no-margin{min-width:unset;width:100%}}.login-dialog-mobile-mode .login-dialog-title-container{padding:var(--login-okd-dialog-title-box-sm-padding-vertical) var(--login-okd-dialog-container-sm-padding-horizontal)}.login-dialog-mobile-mode .login-dialog-container{padding:var(--login-okd-dialog-container-sm-padding-vertical) var(--login-okd-dialog-container-sm-padding-horizontal)}.login-dialog-mobile-mode .login-dialog-customer-box{padding:0 var(--login-okd-dialog-container-sm-padding-horizontal)}.login-dialog-mobile-mode .login-dialog-footer-box{padding:var(--login-okd-dialog-footer-box-sm-padding-top,12px) var(--login-okd-dialog-container-sm-padding-horizontal) var(--login-okd-dialog-footer-box-sm-padding-bottom,20px)}.login-dialog-mobile-mode .login-dialog-btn-box .dialog-btn{width:100%}.login-dialog-mobile-mode .login-dialog-btn-box .dialog-btn+.dialog-btn{margin-left:12px;margin-left:var(--login-okd-dialog-footer-btn-sm-margin-left,12px)}.login-dialog-mobile-mode .login-dialog-btn-box.layout-full{flex-direction:column-reverse}.login-dialog-mobile-mode .login-dialog-btn-box.layout-full .dialog-btn+.dialog-btn{margin-left:0}.login-dialog-mobile-mode .login-dialog-btn-box.layout-full .double-btn:first-child{margin-top:8px;margin-top:var(--login-okd-dialog-footer-btn-full-sm-margin-top,8px)}.login-dialog-mobile-mode .login-dialog-window{border-radius:8px;border-radius:var(--login-okd-dialog-window-sm-border-radius,8px)}.login-dialog-mobile-mode .login-dialog-window.full-page{height:auto!important;min-height:calc(100% - 48px)!important}.login-dialog-mobile-mode .login-dialog-window.full-page-with-show-header{height:auto!important}.login-dialog-mobile-mode .login-dialog-window.bottom-align{border-radius:var(--login-okd-dialog-window-border-radius) var(--login-okd-dialog-window-border-radius) 0 0;bottom:0;top:auto;transform:translate(-50%)}.login-dialog-mobile-mode .login-dialog-window.no-margin{min-width:unset;width:100%}.login-dialog-mobile-mode .login-dialog-container.no-padding,.login-dialog-mobile-mode .login-dialog-customer-box.no-padding{padding:0}.login-dialog-mobile-mode .login-dialog-window{min-width:unset;width:calc(100% - 32px)}.login-dialog.login-action-dialog .login-dialog-window.no-radius{border-radius:0}.login-dialog-group{overflow:hidden}.login-dialog-group-window{display:flex;flex-direction:column}.login-dialog.login-tip-dialog .login-dialog-tip-content{align-items:center;display:flex;flex-direction:column;justify-content:center;text-align:center}.login-dialog.login-tip-dialog .login-dialog-tip-content .tip-title-box{width:100%}.login-dialog.login-tip-dialog .login-dialog-tip-content .tip-title{font-size:var(--login-okd-dialog-tip-title-font-size);font-weight:500;line-height:var(--login-okd-dialog-tip-title-line-height);min-height:var(--login-okd-dialog-tip-title-line-height)}.login-dialog.login-tip-dialog .login-dialog-tip-content .tip-detail{font-size:var(--login-okd-dialog-tip-detail-font-size);font-weight:400;line-height:var(--login-okd-dialog-tip-detail-line-height);margin-top:8px}.login-dialog.login-tip-dialog .login-dialog-tip-content .tip-detail+.tip-detail{margin-top:2px}.login-dialog.login-tip-dialog .login-dialog-tip-content .tip-title{color:var(--login-okd-dialog-tip-title-color)}.login-dialog.login-tip-dialog .login-dialog-tip-content .tip-detail{color:var(--login-okd-dialog-tip-detail-color)}.login-dialog.login-tip-dialog .login-dialog-footer-box{border-top:none}@media (max-width:767px){.login-dialog.login-tip-dialog .login-dialog-window.bottom-align{border-radius:var(--login-okd-dialog-window-border-radius);bottom:16px}.login-dialog.login-tip-dialog .login-dialog-container{padding:var(--login-okd-dialog-tip-container-sm-padding-top,20px) var(--login-okd-dialog-container-sm-padding-horizontal) var(--login-okd-dialog-tip-container-sm-padding-bottom,24px)}.login-dialog.login-tip-dialog .login-dialog-footer-box{padding:0 var(--login-okd-dialog-container-sm-padding-horizontal) var(--login-okd-dialog-tip-footer-box-sm-padding-vertical) var(--login-okd-dialog-container-sm-padding-horizontal)}}@media (min-width:768px){.login-dialog.login-tip-dialog .login-dialog-tip-content{margin-left:auto;margin-right:auto;max-width:var(--login-okd-dialog-tip-window-min-width)}.login-dialog.login-tip-dialog .login-dialog-tip-content.two-btn{max-width:var(--login-okd-dialog-tip-window-2btn-min-width)}.login-dialog.login-tip-dialog .login-dialog-container{padding:var(--login-okd-dialog-tip-container-md-padding-top,28px) var(--login-okd-dialog-container-sm-padding-horizontal) var(--login-okd-dialog-tip-container-md-padding-bottom,24px)}.login-dialog.login-tip-dialog .login-dialog-footer-box{padding:0 var(--login-okd-dialog-container-md-padding-horizontal) var(--login-okd-dialog-tip-footer-box-md-padding-vertical) var(--login-okd-dialog-container-md-padding-horizontal)}}.login-dialog-tip-icon-bg{align-items:center;display:flex;justify-content:center;margin-bottom:12px}.login-dialog-tip-icon-bg .tip-icon{font-size:var(--login-okd-dialog-tip-icon-font-size)}.login-dialog-alert-icon{margin-top:-6px}.login-dialog .login-dialog-window-tip{background-color:var(--login-okd-dialog-window-background);background-color:var(--login-okd-dialog-confirm-window-background,var(--login-okd-dialog-window-background))}.login-dialog.login-new-tip-dialog .login-dialog-new-tip-top{padding:24px 24px 0;padding:var(--login-okd-dialog-confirm-title-padding-top,24px) var(--login-okd-dialog-confirm-title-padding-horizontal,24px) var(--login-okd-dialog-confirm-title-padding-bottom,0)}.login-dialog.login-new-tip-dialog .login-dialog-container.login-dialog-new-tip-container{color:#000;color:var(--login-okd-dialog-confirm-container-color,#000);font-size:14px;font-size:var(--login-okd-dialog-confirm-container-font-size,14px);line-height:20px;line-height:var(--login-okd-dialog-confirm-container-line-height,20px)}@media (min-width:768px){.login-dialog.login-new-tip-dialog .login-dialog-window{max-width:520px;max-width:var(--login-okd-dialog-confirm-max-width,520px);min-width:280px;min-width:var(--login-okd-dialog-confirm-min-width,280px)}.login-dialog.login-new-tip-dialog .login-dialog-container.login-dialog-new-tip-container{padding-bottom:32px;padding-bottom:var(--login-okd-dialog-confirm-container-padding-bottom,32px);padding-top:32px;padding-top:var(--login-okd-dialog-confirm-container-padding-top,32px)}.login-dialog.login-new-tip-dialog .login-dialog-footer-box{padding-bottom:24px;padding-bottom:var(--login-okd-dialog-confirm-footer-padding-bottom,24px);padding-top:0;padding-top:var(--login-okd-dialog-confirm-footer-padding-top,0)}}@media (max-width:767px){.login-dialog.login-new-tip-dialog .login-dialog-window{width:calc(100% - 64px)}.login-dialog.login-new-tip-dialog .login-dialog-container.login-dialog-new-tip-container{padding:8px 24px 24px;padding:var(--login-okd-dialog-confirm-container-sm-padding-top,8px) var(--login-okd-dialog-confirm-container-sm-padding-horizontal,24px) var(--login-okd-dialog-confirm-container-sm-padding-bottom,24px)}.login-dialog.login-new-tip-dialog .login-dialog-container.login-dialog-no-title{padding-top:24px;padding-top:var(--login-okd-dialog-confirm-no-title-padding-top,24px)}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer{padding:0}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button{border:0;border-radius:0;border-top:thin solid #dbdbdb;border-top:thin solid var(--login-okd-dialog-confirm-footer-sm-button-border-color,#dbdbdb)}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button-color{color:var(--login-okd-color-blue-800);color:var(--login-okd-dialog-confirm-footer-sm-button-color,var(--login-okd-color-blue-800))}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button-confirm{font-weight:700}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button-cancel{font-weight:400}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-only-one{border-radius:0 0 var(--login-okd-dialog-window-sm-border-radius) var(--login-okd-dialog-window-sm-border-radius)}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-border-top:first-child{border-radius:0 0 var(--login-okd-dialog-window-sm-border-radius) var(--login-okd-dialog-window-sm-border-radius);margin-top:0}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-border-left:first-child{border-radius:0 0 0 var(--login-okd-dialog-window-sm-border-radius)}.login-dialog.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-border-left+.login-dialog-tip-border-left{border-left:thin solid #dbdbdb;border-left:thin solid var(--login-okd-dialog-confirm-footer-sm-button-border-color,#dbdbdb);border-radius:0 0 var(--login-okd-dialog-window-sm-border-radius) 0;margin-left:0}}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-window{width:calc(100% - 64px)}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-container.login-dialog-new-tip-container{padding:8px 24px 24px;padding:var(--login-okd-dialog-confirm-container-sm-padding-top,8px) var(--login-okd-dialog-confirm-container-sm-padding-horizontal,24px) var(--login-okd-dialog-confirm-container-sm-padding-bottom,24px)}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-container.login-dialog-no-title{padding-top:24px;padding-top:var(--login-okd-dialog-confirm-no-title-padding-top,24px)}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer{padding:0}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button{border:0;border-radius:0;border-top:thin solid #dbdbdb;border-top:thin solid var(--login-okd-dialog-confirm-footer-sm-button-border-color,#dbdbdb)}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button-color{color:var(--login-okd-color-blue-800);color:var(--login-okd-dialog-confirm-footer-sm-button-color,var(--login-okd-color-blue-800))}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button-confirm{font-weight:700}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-button-cancel{font-weight:400}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-only-one{border-radius:0 0 var(--login-okd-dialog-window-sm-border-radius) var(--login-okd-dialog-window-sm-border-radius)}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-border-top:first-child{border-radius:0 0 var(--login-okd-dialog-window-sm-border-radius) var(--login-okd-dialog-window-sm-border-radius);margin-top:0}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-border-left:first-child{border-radius:0 0 0 var(--login-okd-dialog-window-sm-border-radius)}.login-dialog-mobile-mode.login-new-tip-dialog .login-dialog-footer-box.login-dialog-new-tip-footer .login-dialog-tip-border-left+.login-dialog-tip-border-left{border-left:thin solid #dbdbdb;border-left:thin solid var(--login-okd-dialog-confirm-footer-sm-button-border-color,#dbdbdb);border-radius:0 0 var(--login-okd-dialog-window-sm-border-radius) 0;margin-left:0}.iconfont.login-dialog-tip-icon{align-self:flex-start;font-size:22px;font-size:var(--login-okd-dialog-confirm-icon-font-size,22px);font-weight:400;line-height:22px;line-height:var(--login-okd-dialog-confirm-icon-line-height,22px);margin-right:10px;margin-right:var(--login-okd-dialog-confirm-icon-margin-right,10px)}.login-dialog-success-icon,.login-dialog-success-tip-icon{color:var(--login-okd-dialog-tip-success-icon-color)}.login-dialog-info-icon,.login-dialog-info-tip-icon{color:var(--login-okd-dialog-tip-info-icon-color)}.login-dialog-prompt-icon,.login-dialog-prompt-tip-icon{color:var(--login-okd-dialog-tip-prompt-icon-color)}.login-dialog-warn-icon,.login-dialog-warn-tip-icon{color:var(--login-okd-dialog-tip-warn-icon-color)}.login-dialog-alert-icon,.login-dialog-alert-tip-icon{color:var(--login-okd-dialog-tip-alert-icon-color)}.login-dialog-error-icon,.login-dialog-error-tip-icon{color:var(--login-okd-dialog-tip-error-icon-color)}.login-dialog .login-dialog-confirmation-window{background-color:var(--login-okd-dialog-window-background);background-color:var(--login-okd-dialog-confirmation-window-background,var(--login-okd-dialog-window-background))}.login-dialog-confirmation{--inner-okd-dialog-close-btn-padding:22px}.login-dialog-confirmation-header{font-size:16px;font-size:var(--login-okd-dialog-title-font-size,16px);font-weight:700;font-weight:var(--login-okd-dialog-title-font-weight,700);line-height:var(--login-okd-dialog-title-line-height);padding:24px;padding:var(--login-okd-dialog-confirmation-header-padding-top,24px) var(--login-okd-dialog-confirmation-padding-right,24px) var(--login-okd-dialog-confirmation-header-padding-top,24px) var(--login-okd-dialog-confirmation-padding-left,24px)}.login-dialog-confirmation-header-margin{margin-right:36px}.login-dialog-confirmation-container{flex-grow:1;line-height:22px;overflow-y:auto;padding-bottom:8px;padding-left:24px;padding-left:var(--login-okd-dialog-confirmation-padding-left,24px);padding-right:24px;padding-right:var(--login-okd-dialog-confirmation-padding-right,24px);padding-top:8px}.login-dialog-confirmation-container-no-header{padding-top:32px;padding-top:var(--login-okd-dialog-confirmation-container-padding-top,32px)}.login-dialog-confirmation-container-no-footer{padding-bottom:32px;padding-bottom:var(--login-okd-dialog-confirmation-container-padding-bottom,32px)}.login-dialog-confirmation-footer{padding:24px;padding:var(--login-okd-dialog-confirmation-footer-padding-bottom,24px) var(--login-okd-dialog-confirmation-padding-right,24px) var(--login-okd-dialog-confirmation-footer-padding-bottom,24px) var(--login-okd-dialog-confirmation-padding-left,24px)}

.theme-dark,.theme-okcoin,:root {
    --components-verifyBox-switch: var(--login-okd-color-blue-700)
}

.toggle-type-button {
    align-items: center;
    background-color: #f9f9f9;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    padding: 16px
}

.toggle-type-button:not(:last-child) {
    margin-bottom: 12px
}

.toggle-type-button .toggle-type-icon {
    margin-right: 12px
}

.toggle-type-button .toggle-type-detail .toggle-type-title {
    font-size: 15px;
    font-weight: 500;
    line-height: 20px
}

.toggle-type-button .toggle-type-detail .toggle-type-desc {
    color: #3d3d3d;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    max-width: 216px
}

.toggle-type-button .toggle-type-text {
    background-color: #f5f9ff;
    color: #0569ff;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-left: auto;
    padding: 4px 2px
}

.verification-code-input .input-title {
    color: var(--login-okd-color-gray-700);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 4px
}

.verification-code-input .input-title .send-to {
    color: var(--login-okd-color-gray-400);
    font-size: 14px;
    line-height: 16px;
    margin-left: 8px
}

.verification-code-input .switch-type {
    margin-top: 4px
}

.verification-code-input .switch-type .switch-type-desc {
    color: var(--login-okd-color-gray-400);
    font-size: 14px;
    line-height: 16px
}

.verification-code-input .switch-type .switch-type-buttton {
    color: #0569ff;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px
}

.verification-code-input .switch-type .switch-type-buttton.disabled {
    color: var(--login-okd-color-gray-400);
    cursor: default
}

.verified-helper-text {
    align-items: center;
    color: var(--login-okd-color-gray-900);
    display: flex;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 8px
}

.verified-helper-text .verified-ic {
    color: var(--login-okd-color-fq-positive);
    margin-right: 4px
}

.verify-box.horizontal {
    display: flex;
    flex-wrap: wrap;
    width: auto
}

.verify-box.horizontal .code-item {
    margin-right: 20px;
    min-width: 200px
}

.verify-box .hide-item {
    display: none
}

.verify-box .input-title {
    color: var(--login-okd-color-gray-700);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 4px
}

.verify-box .send-to {
    color: var(--login-okd-color-gray-400);
    float: none;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin-left: 8px;
    margin-top: 0;
    text-align: left;
    width: auto
}

.verify-box .form-input-box {
    width: 100%
}

.verify-box .code-item {
    margin-top: 24px
}

.verify-box.first-item-no-margin-top .code-item:first-child {
    margin-top: 0
}

.verify-box .tab-verify-code {
    color: #929292;
    font-size: 12px;
    line-height: 1.5;
    margin-top: 5px
}

.verify-box .tab-verify-code .switch-type {
    color: var(--components-verifyBox-switch);
    cursor: pointer;
    display: inline-block
}

.verify-box .tab-verify-code .switch-type:first-of-type {
    margin-left: 4px
}

.verify-box .tab-verify-code .switch-type.disabled {
    color: #929292;
    cursor: default
}

.verify-box .switch-or {
    margin-left: 4px;
    margin-right: 4px
}

body[data-responsive=false] .form-input-box {
    width: 480px
}

.index_title__TWFEF {
    color: #000;
    font-size: 28px;
    font-weight: 700;
    line-height: 36px;
    margin-bottom: 8px
}

@media (min-width: 768px) {
    .index_title__TWFEF {
        font-size:40px;
        line-height: 53px
    }
}

.index_description__fWv6I {
    color: var(--login-okd-color-gray-700);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px
}

.index_title-size-sm__H5LEx {
    font-size: 28px
}

.index_title-size-x-sm__2-CGM {
    font-size: 24px;
    line-height: 32px
}

.index_description-color-dim__oA-J- {
    color: var(--login-okd-color-content-tertiary)
}

.index_container__\+tfjB,.index_info-container__Pf3LS {
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center
}

.index_info-container__Pf3LS {
    line-height: 20px;
    margin-top: 24px
}

.index_device-name__OJzSs {
    font-size: 16px;
    font-weight: 700;
    line-height: 22px
}

.index_last-active-time__\+r8Qg {
    line-height: 22px
}

.index_description__y3f7J,.index_last-active-time__\+r8Qg {
    color: var(--login-okd-color-content-tertiary)
}

.index_container__1U0Sj {
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center
}

.index_pass-code__ZMiGg {
    background: var(--login-okd-color-background-base-secondary);
    color: var(--login-okd-color-content-primary);
    font-size: 32px;
    font-weight: 700;
    letter-spacing: 10px;
    line-height: 40px;
    margin: 24px 0;
    padding: 16px 12px;
    width: 300px
}

.index_info__tZDmw {
    align-items: center;
    color: var(--login-okd-color-content-tertiary);
    display: flex;
    gap: 5px
}

.index_countdown__O2WAE {
    color: var(--login-okd-color-content-disabled)
}

.index_container__OQpwD {
    padding: 20px 0
}

.index_error-message__IU-ZW {
    color: #eb4b6d;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 32px
}
.okds-close {
    --ok-icon-font-family: "ok-b983c4766d"
}

.okds-close:before {
    content: "\e029";
    font-family: ok-b983c4766d
}

.iconfont {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 16px;
    font-style: normal
}

.iconfont:before {
    display: inline-block
}

@font-face {
    font-display: block;
    font-family: ok-b983c4766d;
    font-style: normal;
    src: url(./39b990bb349711d9b472.woff2) format("woff2")
}

[dir=rtl] .okds-arrow-cheveron-alignleft-md:before,[dir=rtl] .okds-arrow-cheveron-first-md:before,[dir=rtl] .okds-arrow-cheveron-last-md:before,[dir=rtl] .okds-arrow-chevron-left-centered-md:before,[dir=rtl] .okds-arrow-chevron-left-centered-sm:before,[dir=rtl] .okds-arrow-chevron-right-centered-md:before,[dir=rtl] .okds-arrow-chevron-right-centered-sm:before,[dir=rtl] .okds-arrow-chevron-right-centered-xs:before,[dir=rtl] .okds-arrow-pointer-left-md:before,[dir=rtl] .okds-arrow-pointer-left-sm:before,[dir=rtl] .okds-arrow-pointer-right-md:before,[dir=rtl] .okds-arrow-pointer-right-sm:before,[dir=rtl] .okds-arrow-pointer-right-xs:before,[dir=rtl] .okds-communication-idcard:before,[dir=rtl] .okds-copy:before,[dir=rtl] .okds-eye-hide-filled:before,[dir=rtl] .okds-eye-hide:before,[dir=rtl] .okds-guide:before,[dir=rtl] .okds-logout:before,[dir=rtl] .okds-network-fee-standard:before,[dir=rtl] .okds-open-link:before,[dir=rtl] .okds-orders:before,[dir=rtl] .okds-question-mark-circle-fill:before,[dir=rtl] .okds-question-mark-circle:before,[dir=rtl] .okds-report-centre:before {
    transform: scaleX(-1)
}

.theme-light,:root {
    --login-okd-button-primary-normal-default-background: var(--login-okd-color-blue-700);
    --login-okd-button-primary-normal-hover-background: var(--login-okd-color-blue-500);
    --login-okd-button-primary-normal-active-background: var(--login-okd-color-blue-800);
    --login-okd-button-primary-normal-focus-background: var(--login-okd-color-blue-700);
    --login-okd-button-primary-normal-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-primary-normal-default-border-color: var(--login-okd-color-blue-700);
    --login-okd-button-primary-normal-hover-border-color: var(--login-okd-color-blue-500);
    --login-okd-button-primary-normal-active-border-color: var(--login-okd-color-blue-800);
    --login-okd-button-primary-normal-focus-border-color: var(--login-okd-color-blue-700);
    --login-okd-button-primary-normal-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-primary-normal-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-normal-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-focus-shadow: var(--login-okd-shadow-sm),0px 0px 0px 3px rgba(175,207,255,.45);
    --login-okd-button-primary-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-loader-track-color: var(--login-okd-color-blue-500);
    --login-okd-button-primary-normal-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-primary-red-default-background: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-hover-background: var(--login-okd-color-red-500);
    --login-okd-button-primary-red-active-background: var(--login-okd-color-red-800);
    --login-okd-button-primary-red-focus-background: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-primary-red-default-border-color: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-hover-border-color: var(--login-okd-color-red-500);
    --login-okd-button-primary-red-active-border-color: var(--login-okd-color-red-800);
    --login-okd-button-primary-red-focus-border-color: var(--login-okd-color-red-800);
    --login-okd-button-primary-red-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-primary-red-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-red-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-red-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-primary-red-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-focus-shadow: var(--login-okd-shadow-sm),0px 0px 0px 3px rgba(247,150,176,.45);
    --login-okd-button-primary-red-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-loader-track-color: var(--login-okd-color-red-500);
    --login-okd-button-primary-red-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-primary-green-default-background: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-hover-background: var(--login-okd-color-green-500);
    --login-okd-button-primary-green-active-background: var(--login-okd-color-green-800);
    --login-okd-button-primary-green-focus-background: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-primary-green-default-border-color: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-hover-border-color: var(--login-okd-color-green-500);
    --login-okd-button-primary-green-active-border-color: var(--login-okd-color-green-800);
    --login-okd-button-primary-green-focus-border-color: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-primary-green-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-green-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-green-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-primary-green-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-focus-shadow: var(--login-okd-shadow-sm),0px 0px 0px 3px rgba(120,222,157,.45);
    --login-okd-button-primary-green-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-loader-track-color: var(--login-okd-color-green-500);
    --login-okd-button-primary-green-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-secondary-normal-default-background: var(--login-okd-color-blue-100);
    --login-okd-button-secondary-normal-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-secondary-normal-active-background: var(--login-okd-color-blue-200);
    --login-okd-button-secondary-normal-focus-background: var(--login-okd-color-blue-100);
    --login-okd-button-secondary-normal-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-default-border-color: var(--login-okd-color-blue-100);
    --login-okd-button-secondary-normal-hover-border-color: var(--login-okd-color-blue-050);
    --login-okd-button-secondary-normal-active-border-color: var(--login-okd-color-blue-200);
    --login-okd-button-secondary-normal-focus-border-color: var(--login-okd-color-blue-100);
    --login-okd-button-secondary-normal-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-default-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-secondary-normal-hover-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-secondary-normal-active-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-secondary-normal-focus-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-secondary-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-normal-default-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-secondary-normal-hover-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-secondary-normal-active-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-secondary-normal-focus-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-secondary-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px rgba(175,207,255,.45);
    --login-okd-button-secondary-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-loader-track-color: var(--login-okd-color-blue-050);
    --login-okd-button-secondary-normal-loader-mark-color: var(--login-okd-color-blue-700);
    --login-okd-button-secondary-grey-default-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-hover-background: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-grey-active-background: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-grey-default-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-hover-border-color: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-grey-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-focus-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-disabled-border-color: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-grey-default-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-hover-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-active-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-focus-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-grey-default-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-hover-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-active-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-focus-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-secondary-grey-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-grey-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-secondary-grey-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-focus-shadow: var(--login-okd-shadow-sm),0px 0px 0px 3px var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-loader-track-color: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-loader-mark-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-default-background: #fff;
    --login-okd-button-basic-normal-hover-background: #fff;
    --login-okd-button-basic-normal-active-background: var(--login-okd-color-gray-050);
    --login-okd-button-basic-normal-focus-background: #fff;
    --login-okd-button-basic-normal-disabled-background: #fff;
    --login-okd-button-basic-normal-default-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-basic-normal-hover-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-basic-normal-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-basic-normal-focus-border-color: var(--login-okd-color-blue-300);
    --login-okd-button-basic-normal-disabled-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-basic-normal-default-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-hover-font-color: var(--login-okd-color-gray-400);
    --login-okd-button-basic-normal-active-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-basic-normal-focus-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-default-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-hover-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-active-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-focus-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-basic-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-basic-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px rgba(175,207,255,.45);
    --login-okd-button-basic-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-loader-track-color: var(--login-okd-color-blue-100);
    --login-okd-button-basic-normal-loader-mark-color: var(--login-okd-color-blue-700);
    --login-okd-button-plain-normal-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-active-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-focus-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-normal-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-default-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-hover-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-active-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-focus-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-disabled-font-color: rgba(0,94,234,.45);
    --login-okd-button-plain-normal-default-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-hover-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-active-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-focus-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-disabled-icon-color: rgba(0,94,234,.45);
    --login-okd-button-plain-normal-default-shadow: none;
    --login-okd-button-plain-normal-hover-shadow: none;
    --login-okd-button-plain-normal-active-shadow: none;
    --login-okd-button-plain-normal-focus-shadow: none;
    --login-okd-button-plain-normal-disabled-shadow: none;
    --login-okd-button-plain-red-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-hover-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-active-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-focus-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-red-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-default-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-hover-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-active-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-focus-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-disabled-font-color: rgba(96,32,49,.45);
    --login-okd-button-plain-red-default-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-hover-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-active-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-focus-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-disabled-icon-color: rgba(96,32,49,.45);
    --login-okd-button-plain-red-default-shadow: none;
    --login-okd-button-plain-red-hover-shadow: none;
    --login-okd-button-plain-red-active-shadow: none;
    --login-okd-button-plain-red-focus-shadow: none;
    --login-okd-button-plain-red-disabled-shadow: none;
    --login-okd-button-plain-green-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-hover-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-active-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-focus-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-green-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-default-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-hover-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-active-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-focus-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-disabled-font-color: rgba(12,80,37,.45);
    --login-okd-button-plain-green-default-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-hover-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-active-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-focus-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-disabled-icon-color: rgba(12,80,37,.45);
    --login-okd-button-plain-green-default-shadow: none;
    --login-okd-button-plain-green-hover-shadow: none;
    --login-okd-button-plain-green-active-shadow: none;
    --login-okd-button-plain-green-focus-shadow: none;
    --login-okd-button-plain-green-disabled-shadow: none;
    --login-okd-button-plain-orange-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-hover-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-active-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-focus-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-orange-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-default-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-hover-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-active-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-focus-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-disabled-font-color: rgba(233,96,16,.45);
    --login-okd-button-plain-orange-default-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-hover-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-active-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-focus-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-disabled-icon-color: rgba(233,96,16,.45);
    --login-okd-button-plain-orange-default-shadow: none;
    --login-okd-button-plain-orange-hover-shadow: none;
    --login-okd-button-plain-orange-active-shadow: none;
    --login-okd-button-plain-orange-focus-shadow: none;
    --login-okd-button-plain-orange-disabled-shadow: none;
    --login-okd-button-plain-yellow-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-hover-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-active-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-focus-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-yellow-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-default-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-hover-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-active-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-focus-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-disabled-font-color: rgba(234,169,0,.45);
    --login-okd-button-plain-yellow-default-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-hover-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-active-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-focus-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-disabled-icon-color: rgba(234,169,0,.45);
    --login-okd-button-plain-yellow-default-shadow: none;
    --login-okd-button-plain-yellow-hover-shadow: none;
    --login-okd-button-plain-yellow-active-shadow: none;
    --login-okd-button-plain-yellow-focus-shadow: none;
    --login-okd-button-plain-yellow-disabled-shadow: none;
    --login-okd-button-xxs-font-size: var(--login-okd-font-size-xs);
    --login-okd-button-xs-font-size: var(--login-okd-font-size-xs);
    --login-okd-button-sm-font-size: var(--login-okd-font-size-md);
    --login-okd-button-md-font-size: var(--login-okd-font-size-md);
    --login-okd-button-lg-font-size: var(--login-okd-font-size-base);
    --login-okd-button-xl-font-size: 18px;
    --login-okd-button-xxs-icon-size: 14px;
    --login-okd-button-xs-icon-size: 14px;
    --login-okd-button-sm-icon-size: 18px;
    --login-okd-button-md-icon-size: 18px;
    --login-okd-button-lg-icon-size: 18px;
    --login-okd-button-xl-icon-size: 18px;
    --login-okd-button-xxs-icon-margin: 6px;
    --login-okd-button-xs-icon-margin: 6px;
    --login-okd-button-sm-icon-margin: 6px;
    --login-okd-button-md-icon-margin: 6px;
    --login-okd-button-lg-icon-margin: 8px;
    --login-okd-button-xl-icon-margin: 8px;
    --login-okd-button-xxs-line-height: var(--login-okd-line-height-xs);
    --login-okd-button-xs-line-height: var(--login-okd-line-height-xs);
    --login-okd-button-sm-line-height: var(--login-okd-line-height-md);
    --login-okd-button-md-line-height: var(--login-okd-line-height-md);
    --login-okd-button-lg-line-height: var(--login-okd-line-height-base);
    --login-okd-button-xl-line-height: var(--login-okd-line-height-base);
    --login-okd-button-xxs-padding-horizontal: 8px;
    --login-okd-button-xxs-padding-vertical: 3px;
    --login-okd-button-xs-padding-horizontal: 8px;
    --login-okd-button-xs-padding-vertical: 5px;
    --login-okd-button-sm-padding-horizontal: 12px;
    --login-okd-button-sm-padding-vertical: 7px;
    --login-okd-button-md-padding-horizontal: 16px;
    --login-okd-button-md-padding-vertical: 9px;
    --login-okd-button-lg-padding-horizontal: 24px;
    --login-okd-button-lg-padding-vertical: 13px;
    --login-okd-button-xl-padding-horizontal: 24px;
    --login-okd-button-xl-padding-vertical: 17px;
    --login-okd-button-xxs-min-width: 63px;
    --login-okd-button-xs-min-width: 63px;
    --login-okd-button-sm-min-width: 81px;
    --login-okd-button-md-min-width: 90px;
    --login-okd-button-lg-min-width: 108px;
    --login-okd-button-xl-min-width: 126px;
    --login-okd-button-xxs-border-radius: 60px;
    --login-okd-button-xs-border-radius: 60px;
    --login-okd-button-sm-border-radius: 60px;
    --login-okd-button-md-border-radius: 60px;
    --login-okd-button-lg-border-radius: 60px;
    --login-okd-button-xl-border-radius: 60px;
    --login-okd-button-xxs-border-size: 1px;
    --login-okd-button-xs-border-size: 1px;
    --login-okd-button-sm-border-size: 1px;
    --login-okd-button-md-border-size: 1px;
    --login-okd-button-lg-border-size: 1px;
    --login-okd-button-xl-border-size: 1px;
    --login-okd-button-xl-loader-size: 18px;
    --login-okd-button-lg-loader-size: 14px;
    --login-okd-button-md-loader-size: 14px;
    --login-okd-button-sm-loader-size: 14px;
    --login-okd-button-xs-loader-size: 14px;
    --login-okd-button-xxs-loader-size: 14px;
    --login-okd-button-xl-loader-text-margin-left: 8px;
    --login-okd-button-lg-loader-text-margin-left: 8px;
    --login-okd-button-md-loader-text-margin-left: 6px;
    --login-okd-button-sm-loader-text-margin-left: 6px;
    --login-okd-button-xs-loader-text-margin-left: 6px;
    --login-okd-button-xxs-loader-text-margin-left: 6px;
    --login-okd-button-s-font-size: 14px;
    --login-okd-button-s-icon-size: 18px;
    --login-okd-button-s-icon-margin: 6px;
    --login-okd-button-s-line-height: 16px;
    --login-okd-button-s-padding-horizontal: 12px;
    --login-okd-button-s-padding-vertical: 7px;
    --login-okd-button-s-min-width: 72px;
    --login-okd-button-s-border-radius: 60px;
    --login-okd-button-s-loader-size: 14px;
    --login-okd-button-s-loader-text-margin-left: 6px;
    --login-okd-button-xl-font-weight: 600;
    --login-okd-button-lg-font-weight: 500;
    --login-okd-button-md-font-weight: 500;
    --login-okd-button-sm-font-weight: 500;
    --login-okd-button-rect-xxs-border-radius: 4px;
    --login-okd-button-rect-xs-border-radius: 4px;
    --login-okd-button-rect-sm-border-radius: 4px;
    --login-okd-button-rect-s-border-radius: 4px;
    --login-okd-button-rect-md-border-radius: 4px;
    --login-okd-button-rect-lg-border-radius: 8px;
    --login-okd-button-rect-xl-border-radius: 8px;
    --login-okd-button-fill-highlight-default-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-highlight-hover-background: var(--login-okd-color-container-contrast);
    --login-okd-button-fill-highlight-active-background: var(--login-okd-color-container-contrast);
    --login-okd-button-fill-highlight-focus-background: var(--login-okd-color-gray-900);
    --login-okd-button-fill-highlight-disabled-background: var(--login-okd-color-neutral-20);
    --login-okd-button-fill-highlight-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-focus-border-color: var(--login-okd-color-gray-900);
    --login-okd-button-fill-highlight-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-hover-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-active-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-highlight-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-active-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-highlight-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #fff,0px 0px 0px 3.5px #1d202359;
    --login-okd-button-fill-highlight-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-loader-track-color: hsla(0,0%,98%,.26);
    --login-okd-button-fill-highlight-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-fill-highlight-border-size: 0px;
    --login-okd-button-fill-primary-default-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-hover-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-active-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-focus-background: var(--login-okd-color-blue-900);
    --login-okd-button-fill-primary-disabled-background: var(--login-okd-color-neutral-20);
    --login-okd-button-fill-primary-default-border-color: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-primary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-primary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-primary-disabled-border-color: var(--login-okd-color-background-surface-primary);
    --login-okd-button-fill-primary-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-primary-hover-font-color: hsla(0,0%,100%,.6);
    --login-okd-button-fill-primary-active-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-primary-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-primary-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-primary-hover-icon-color: hsla(0,0%,100%,.6);
    --login-okd-button-fill-primary-active-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-primary-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-primary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #fff,0px 0px 0px 3.5px #2d60e040;
    --login-okd-button-fill-primary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-loader-track-color: hsla(0,0%,98%,.26);
    --login-okd-button-fill-primary-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-fill-primary-border-size: 0px;
    --login-okd-button-fill-secondary-default-background: var(--login-okd-color-blue-050);
    --login-okd-button-fill-secondary-hover-background: var(--login-okd-color-blue-100);
    --login-okd-button-fill-secondary-active-background: var(--login-okd-color-blue-200);
    --login-okd-button-fill-secondary-focus-background: var(--login-okd-color-blue-100);
    --login-okd-button-fill-secondary-disabled-background: var(--login-okd-color-blue-050);
    --login-okd-button-fill-secondary-default-border-color: var(--login-okd-color-blue-050);
    --login-okd-button-fill-secondary-hover-border-color: var(--login-okd-color-blue-100);
    --login-okd-button-fill-secondary-active-border-color: var(--login-okd-color-blue-200);
    --login-okd-button-fill-secondary-focus-border-color: var(--login-okd-color-blue-100);
    --login-okd-button-fill-secondary-disabled-border-color: var(--login-okd-color-blue-050);
    --login-okd-button-fill-secondary-default-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-fill-secondary-hover-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-fill-secondary-active-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-fill-secondary-focus-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-fill-secondary-disabled-font-color: var(--login-okd-color-blue-300);
    --login-okd-button-fill-secondary-default-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-fill-secondary-hover-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-fill-secondary-active-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-fill-secondary-focus-icon-color: var(--login-okd-color-blue-700);
    --login-okd-button-fill-secondary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-secondary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #fff,0px 0px 0px 3.5px #2d60e040;
    --login-okd-button-fill-secondary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-loader-track-color: var(--login-okd-color-blue-050);
    --login-okd-button-fill-secondary-loader-mark-color: var(--login-okd-color-blue-700);
    --login-okd-button-fill-secondary-border-size: 0px;
    --login-okd-button-fill-tertiary-border-size: 0px;
    --login-okd-button-fill-tertiary-default-background: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-hover-background: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-focus-background: hsla(0,0%,100%,.8);
    --login-okd-button-fill-tertiary-active-background: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-disabled-background: hsla(0,0%,100%,.06);
    --login-okd-button-fill-tertiary-disabled-font-color: hsla(0,0%,100%,.36);
    --login-okd-button-fill-tertiary-disabled-border-color: hsla(0,0%,100%,.06);
    --login-okd-button-fill-tertiary-default-border-color: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-hover-border-color: hsla(0,0%,100%,0);
    --login-okd-button-fill-tertiary-focus-border-color: rgba(48,16,25,0);
    --login-okd-button-fill-tertiary-active-border-color: hsla(0,0%,100%,0);
    --login-okd-button-fill-tertiary-loader-track-color: var(--login-okd-color-border-primary);
    --login-okd-button-fill-tertiary-loader-mark-color: var(--login-okd-color-border-selected);
    --login-okd-button-fill-tertiary-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-tertiary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-tertiary-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-hover-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-hover-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-focus-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-tertiary-focus-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-active-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-active-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-disabled-icon-color: hsla(0,0%,100%,.36);
    --login-okd-button-fill-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-border-size: 0px;
    --login-okd-button-fill-quaternary-default-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-quaternary-default-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-default-border-color: transparent;
    --login-okd-button-fill-quaternary-hover-background: hsla(0,0%,100%,.25);
    --login-okd-button-fill-quaternary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-hover-font-color: hsla(0,0%,100%,.25);
    --login-okd-button-fill-quaternary-focus-background: hsla(0,0%,100%,.25);
    --login-okd-button-fill-quaternary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-focus-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-active-background: hsla(0,0%,100%,.25);
    --login-okd-button-fill-quaternary-active-border-color: transparent;
    --login-okd-button-fill-quaternary-active-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-disabled-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-quaternary-disabled-font-color: hsla(0,0%,100%,.25);
    --login-okd-button-fill-quaternary-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-loader-track-color: hsla(0,0%,100%,.25);
    --login-okd-button-fill-quaternary-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-default-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-hover-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-focus-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-active-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-disabled-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-red-default-background: var(--login-okd-color-semantic-negative);
    --login-okd-button-fill-red-hover-background: rgba(235,75,109,.8);
    --login-okd-button-fill-red-active-background: rgba(235,75,109,.8);
    --login-okd-button-fill-red-focus-background: var(--login-okd-color-red-800);
    --login-okd-button-fill-red-disabled-background: var(--login-okd-color-neutral-20);
    --login-okd-button-fill-red-default-border-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-fill-red-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-red-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-red-focus-border-color: var(--login-okd-color-red-800);
    --login-okd-button-fill-red-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-red-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-red-hover-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-red-active-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-red-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-red-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-red-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-red-active-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-red-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-red-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-fill-red-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #fff,0px 0px 0px 3.5px #e35e5e66;
    --login-okd-button-fill-red-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-loader-track-color: hsla(0,0%,98%,.26);
    --login-okd-button-fill-red-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-fill-red-border-size: 0px;
    --login-okd-button-fill-green-default-background: var(--login-okd-color-semantic-positive);
    --login-okd-button-fill-green-hover-background: rgba(49,189,101,.8);
    --login-okd-button-fill-green-active-background: rgba(49,189,101,.8);
    --login-okd-button-fill-green-focus-background: var(--login-okd-color-green-900);
    --login-okd-button-fill-green-disabled-background: var(--login-okd-color-neutral-20);
    --login-okd-button-fill-green-default-border-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-fill-green-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-green-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-green-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-green-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-green-hover-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-green-active-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-green-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-green-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-green-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-green-active-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-green-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-green-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-fill-green-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-focus-shadow: 0px 0px 0px 1px #fff,0px 0px 0px 3.5px #2ead6573;
    --login-okd-button-fill-green-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-loader-track-color: hsla(0,0%,98%,.26);
    --login-okd-button-fill-green-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-fill-green-border-size: 0px;
    --login-okd-button-fill-grey-default-background: var(--login-okd-color-background-surface-primary);
    --login-okd-button-fill-grey-hover-background: var(--login-okd-color-neutral-30);
    --login-okd-button-fill-grey-active-background: var(--login-okd-color-neutral-20);
    --login-okd-button-fill-grey-focus-background: hsla(0,0%,86%,.5);
    --login-okd-button-fill-grey-disabled-background: var(--login-okd-color-neutral-20);
    --login-okd-button-fill-grey-default-border-color: var(--login-okd-color-background-surface-primary);
    --login-okd-button-fill-grey-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-grey-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-grey-focus-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-fill-grey-disabled-border-color: var(--login-okd-color-background-surface-disable);
    --login-okd-button-fill-grey-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-focus-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-fill-grey-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-grey-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-focus-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-fill-grey-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-fill-grey-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-focus-shadow: 0px 0px 0px 0px #00000000,0px 0px 0px 3.5px #d8dce673;
    --login-okd-button-fill-grey-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-loader-track-color: var(--login-okd-color-border-primary);
    --login-okd-button-fill-grey-loader-mark-color: var(--login-okd-color-border-selected);
    --login-okd-button-fill-grey-border-size: 0px;
    --login-okd-button-outline-highlight-border-size: 1.5px;
    --login-okd-button-outline-highlight-hover-background: var(--login-okd-color-container-inverse);
    --login-okd-button-outline-highlight-hover-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-focus-background: var(--login-okd-color-gray-900);
    --login-okd-button-outline-highlight-focus-border-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-highlight-focus-font-color: var(--login-okd-color-white);
    --login-okd-button-outline-highlight-active-background: var(--login-okd-color-container-inverse);
    --login-okd-button-outline-highlight-active-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-highlight-disabled-border-color: var(--login-okd-color-border-primary);
    --login-okd-button-outline-highlight-hover-border-color: var(--login-okd-color-border-selected);
    --login-okd-button-outline-highlight-active-border-color: var(--login-okd-color-border-selected);
    --login-okd-button-outline-highlight-loader-track-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-highlight-loader-mark-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-highlight-default-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-highlight-default-border-color: var(--login-okd-color-border-selected);
    --login-okd-button-outline-highlight-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-highlight-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-highlight-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-focus-icon-color: var(--login-okd-color-white);
    --login-okd-button-outline-highlight-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-active-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-highlight-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-highlight-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-primary-default-background: hsla(0,0%,100%,0);
    --login-okd-button-outline-primary-hover-background: var(--login-okd-color-neutral-20);
    --login-okd-button-outline-primary-active-background: var(--login-okd-color-neutral-20);
    --login-okd-button-outline-primary-focus-background: var(--login-okd-color-background-2);
    --login-okd-button-outline-primary-disabled-background: var(--login-okd-color-neutral-20);
    --login-okd-button-outline-primary-default-border-color: var(--login-okd-color-border-secondary);
    --login-okd-button-outline-primary-hover-border-color: var(--login-okd-color-border-secondary);
    --login-okd-button-outline-primary-active-border-color: var(--login-okd-color-border-secondary);
    --login-okd-button-outline-primary-focus-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-primary-disabled-border-color: var(--login-okd-color-border-primary);
    --login-okd-button-outline-primary-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-focus-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-primary-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-primary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-focus-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-primary-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-primary-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-outline-primary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-focus-shadow: 0px 0px 0px 3px #00000014;
    --login-okd-button-outline-primary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-loader-track-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-primary-loader-mark-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-primary-border-size: 1px;
    --login-okd-button-outline-secondary-default-background: var(--login-okd-color-white);
    --login-okd-button-outline-secondary-hover-background: var(--login-okd-color-background-2);
    --login-okd-button-outline-secondary-active-background: var(--login-okd-color-gray-050);
    --login-okd-button-outline-secondary-focus-background: var(--login-okd-color-background-2);
    --login-okd-button-outline-secondary-disabled-background: var(--login-okd-color-white);
    --login-okd-button-outline-secondary-default-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-secondary-hover-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-secondary-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-secondary-focus-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-secondary-disabled-border-color: #ebebeb;
    --login-okd-button-outline-secondary-default-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-secondary-hover-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-active-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-secondary-focus-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-disabled-font-color: #bdbdbd;
    --login-okd-button-outline-secondary-default-icon-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-secondary-hover-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-active-icon-color: var(--login-okd-color-gray-900);
    --login-okd-button-outline-secondary-focus-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-outline-secondary-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-outline-secondary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3px #00000014;
    --login-okd-button-outline-secondary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-loader-track-color: rgba(0,0,0,.25);
    --login-okd-button-outline-secondary-loader-mark-color: var(--login-okd-color-black);
    --login-okd-button-outline-secondary-border-size: 1px;
    --login-okd-button-outline-tertiary-border-size: 1.5px;
    --login-okd-button-outline-tertiary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-tertiary-default-border-color: var(--login-okd-color-border-contrast);
    --login-okd-button-outline-tertiary-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-tertiary-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-tertiary-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-hover-background: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-hover-border-color: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-focus-icon-color: var(--login-okd-color-black);
    --login-okd-button-outline-tertiary-focus-font-color: var(--login-okd-color-black);
    --login-okd-button-outline-tertiary-focus-border-color: var(--login-okd-color-white);
    --login-okd-button-outline-tertiary-focus-background: var(--login-okd-color-white);
    --login-okd-button-outline-tertiary-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-active-border-color: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-active-background: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-disabled-icon-color: hsla(0,0%,100%,.36);
    --login-okd-button-outline-tertiary-disabled-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-tertiary-disabled-border-color: hsla(0,0%,98%,.12);
    --login-okd-button-outline-tertiary-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-tertiary-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-outline-tertiary-loader-track-color: hsla(0,0%,98%,.3);
    --login-okd-button-text-primary-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-hover-background: var(--login-okd-color-neutral-20);
    --login-okd-button-text-primary-active-background: var(--login-okd-color-neutral-20);
    --login-okd-button-text-primary-focus-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-primary-disabled-background: undefined;
    --login-okd-button-text-primary-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-focus-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-primary-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-text-primary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-focus-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-primary-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-text-primary-default-shadow: none;
    --login-okd-button-text-primary-hover-shadow: none;
    --login-okd-button-text-primary-active-shadow: none;
    --login-okd-button-text-primary-focus-shadow: none;
    --login-okd-button-text-primary-disabled-shadow: none;
    --login-okd-button-text-primary-border-size: 1px;
    --login-okd-button-text-secondary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-secondary-active-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-secondary-focus-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-secondary-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-text-secondary-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-default-font-color: var(--login-okd-color-fq-blue-lv1);
    --login-okd-button-text-secondary-hover-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-secondary-active-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-secondary-focus-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-secondary-disabled-font-color: rgba(0,94,234,.45);
    --login-okd-button-text-secondary-default-icon-color: var(--login-okd-color-fq-blue-lv1);
    --login-okd-button-text-secondary-hover-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-secondary-active-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-secondary-focus-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-text-secondary-disabled-icon-color: rgba(0,94,234,.45);
    --login-okd-button-text-secondary-default-shadow: none;
    --login-okd-button-text-secondary-hover-shadow: none;
    --login-okd-button-text-secondary-active-shadow: none;
    --login-okd-button-text-secondary-focus-shadow: none;
    --login-okd-button-text-secondary-disabled-shadow: none;
    --login-okd-button-text-secondary-border-size: 1px;
    --login-okd-button-text-red-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-hover-background: rgba(235,75,109,.05);
    --login-okd-button-text-red-active-background: rgba(235,75,109,.05);
    --login-okd-button-text-red-focus-background: var(--login-okd-color-red-050);
    --login-okd-button-text-red-disabled-background: hsla(0,0%,98%,0);
    --login-okd-button-text-red-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-default-font-color: var(--login-okd-color-prefer-red-text);
    --login-okd-button-text-red-hover-font-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-text-red-active-font-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-text-red-focus-font-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-disabled-font-color: rgba(235,75,109,.45);
    --login-okd-button-text-red-default-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-hover-icon-color: var(--login-okd-color-prefer-red-text);
    --login-okd-button-text-red-active-icon-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-text-red-focus-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-disabled-icon-color: rgba(235,75,109,.45);
    --login-okd-button-text-red-default-shadow: none;
    --login-okd-button-text-red-hover-shadow: none;
    --login-okd-button-text-red-active-shadow: none;
    --login-okd-button-text-red-focus-shadow: none;
    --login-okd-button-text-red-disabled-shadow: none;
    --login-okd-button-text-red-border-size: 1px;
    --login-okd-button-text-green-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-hover-background: rgba(49,189,101,.05);
    --login-okd-button-text-green-active-background: rgba(49,189,101,.05);
    --login-okd-button-text-green-focus-background: var(--login-okd-color-green-050);
    --login-okd-button-text-green-disabled-background: hsla(0,0%,98%,0);
    --login-okd-button-text-green-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-green-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-default-font-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-hover-font-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-active-font-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-focus-font-color: var(--login-okd-color-green-800);
    --login-okd-button-text-green-disabled-font-color: rgba(49,189,101,.45);
    --login-okd-button-text-green-default-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-hover-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-active-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-focus-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-text-green-disabled-icon-color: rgba(49,189,101,.45);
    --login-okd-button-text-green-default-shadow: none;
    --login-okd-button-text-green-hover-shadow: none;
    --login-okd-button-text-green-active-shadow: none;
    --login-okd-button-text-green-focus-shadow: none;
    --login-okd-button-text-green-disabled-shadow: none;
    --login-okd-button-text-green-border-size: 1px;
    --login-okd-button-text-yellow-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-hover-background: rgba(255,177,23,.05);
    --login-okd-button-text-yellow-active-background: rgba(255,177,23,.05);
    --login-okd-button-text-yellow-focus-background: var(--login-okd-color-yellow-050);
    --login-okd-button-text-yellow-disabled-background: hsla(0,0%,98%,0);
    --login-okd-button-text-yellow-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-default-font-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-hover-font-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-active-font-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-focus-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-text-yellow-disabled-font-color: rgba(255,177,23,.45);
    --login-okd-button-text-yellow-default-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-hover-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-active-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-focus-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-text-yellow-disabled-icon-color: rgba(255,177,23,.45);
    --login-okd-button-text-yellow-default-shadow: none;
    --login-okd-button-text-yellow-hover-shadow: none;
    --login-okd-button-text-yellow-active-shadow: none;
    --login-okd-button-text-yellow-focus-shadow: none;
    --login-okd-button-text-yellow-disabled-shadow: none;
    --login-okd-button-text-yellow-border-size: 1px;
    --login-okd-button-text-orange-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-hover-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-active-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-focus-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-text-orange-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-default-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-hover-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-active-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-focus-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-disabled-font-color: rgba(233,96,16,.45);
    --login-okd-button-text-orange-default-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-hover-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-active-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-focus-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-disabled-icon-color: rgba(233,96,16,.45);
    --login-okd-button-text-orange-default-shadow: none;
    --login-okd-button-text-orange-hover-shadow: none;
    --login-okd-button-text-orange-active-shadow: none;
    --login-okd-button-text-orange-focus-shadow: none;
    --login-okd-button-text-orange-disabled-shadow: none;
    --login-okd-button-text-orange-border-size: 1px
}

.theme-dark {
    --login-okd-button-primary-normal-default-background: var(--login-okd-color-blue-900);
    --login-okd-button-primary-normal-hover-background: var(--login-okd-color-blue-700);
    --login-okd-button-primary-normal-active-background: var(--login-okd-color-blue-300);
    --login-okd-button-primary-normal-focus-background: var(--login-okd-color-blue-900);
    --login-okd-button-primary-normal-disabled-background: var(--login-okd-color-gray-400);
    --login-okd-button-primary-normal-default-border-color: var(--login-okd-color-blue-900);
    --login-okd-button-primary-normal-hover-border-color: var(--login-okd-color-blue-700);
    --login-okd-button-primary-normal-active-border-color: var(--login-okd-color-blue-300);
    --login-okd-button-primary-normal-focus-border-color: var(--login-okd-color-blue-900);
    --login-okd-button-primary-normal-disabled-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-primary-normal-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-disabled-font-color: var(--login-okd-color-gray-500);
    --login-okd-button-primary-normal-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-disabled-icon-color: var(--login-okd-color-gray-500);
    --login-okd-button-primary-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-blue-200);
    --login-okd-button-primary-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-primary-normal-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-primary-red-default-background: var(--login-okd-color-red-900);
    --login-okd-button-primary-red-hover-background: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-active-background: var(--login-okd-color-red-300);
    --login-okd-button-primary-red-focus-background: var(--login-okd-color-red-900);
    --login-okd-button-primary-red-disabled-background: var(--login-okd-color-gray-400);
    --login-okd-button-primary-red-default-border-color: var(--login-okd-color-red-900);
    --login-okd-button-primary-red-hover-border-color: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-active-border-color: var(--login-okd-color-red-300);
    --login-okd-button-primary-red-focus-border-color: var(--login-okd-color-red-900);
    --login-okd-button-primary-red-disabled-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-primary-red-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-disabled-font-color: var(--login-okd-color-gray-500);
    --login-okd-button-primary-red-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-disabled-icon-color: var(--login-okd-color-gray-500);
    --login-okd-button-primary-red-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-primary-red-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-red-200);
    --login-okd-button-primary-red-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-primary-red-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-primary-green-default-background: var(--login-okd-color-green-900);
    --login-okd-button-primary-green-hover-background: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-active-background: var(--login-okd-color-green-300);
    --login-okd-button-primary-green-focus-background: var(--login-okd-color-green-900);
    --login-okd-button-primary-green-disabled-background: var(--login-okd-color-gray-400);
    --login-okd-button-primary-green-default-border-color: var(--login-okd-color-green-900);
    --login-okd-button-primary-green-hover-border-color: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-active-border-color: var(--login-okd-color-green-300);
    --login-okd-button-primary-green-focus-border-color: var(--login-okd-color-green-900);
    --login-okd-button-primary-green-disabled-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-primary-green-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-disabled-font-color: var(--login-okd-color-gray-500);
    --login-okd-button-primary-green-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-disabled-icon-color: var(--login-okd-color-gray-500);
    --login-okd-button-primary-green-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-primary-green-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-green-200);
    --login-okd-button-primary-green-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-primary-green-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-secondary-normal-default-background: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-normal-hover-background: var(--login-okd-color-gray-500);
    --login-okd-button-secondary-normal-active-background: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-normal-focus-background: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-normal-disabled-background: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-normal-default-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-normal-hover-border-color: var(--login-okd-color-gray-500);
    --login-okd-button-secondary-normal-active-border-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-normal-focus-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-normal-disabled-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-normal-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-disabled-font-color: var(--login-okd-color-gray-500);
    --login-okd-button-secondary-normal-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-normal-disabled-icon-color: var(--login-okd-color-gray-500);
    --login-okd-button-secondary-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-200);
    --login-okd-button-secondary-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-loader-track-color: var(--login-okd-color-gray-600);
    --login-okd-button-secondary-normal-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-secondary-grey-default-background: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-grey-hover-background: var(--login-okd-color-gray-500);
    --login-okd-button-secondary-grey-active-background: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-grey-focus-background: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-grey-disabled-background: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-default-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-grey-hover-border-color: var(--login-okd-color-gray-500);
    --login-okd-button-secondary-grey-active-border-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-grey-focus-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-secondary-grey-disabled-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-disabled-font-color: var(--login-okd-color-gray-600);
    --login-okd-button-secondary-grey-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-secondary-grey-disabled-icon-color: var(--login-okd-color-gray-600);
    --login-okd-button-secondary-grey-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-secondary-grey-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-loader-track-color: var(--login-okd-color-gray-600);
    --login-okd-button-secondary-grey-loader-mark-color: var(--login-okd-color-gray-900);
    --login-okd-button-basic-normal-default-background: var(--login-okd-color-transparent);
    --login-okd-button-basic-normal-hover-background: var(--login-okd-color-gray-200);
    --login-okd-button-basic-normal-active-background: var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-focus-background: var(--login-okd-color-transparent);
    --login-okd-button-basic-normal-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-basic-normal-default-border-color: var(--login-okd-color-gray-500);
    --login-okd-button-basic-normal-hover-border-color: var(--login-okd-color-gray-500);
    --login-okd-button-basic-normal-active-border-color: var(--login-okd-color-gray-500);
    --login-okd-button-basic-normal-focus-border-color: var(--login-okd-color-gray-500);
    --login-okd-button-basic-normal-disabled-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-basic-normal-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-disabled-font-color: var(--login-okd-color-gray-500);
    --login-okd-button-basic-normal-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-disabled-icon-color: var(--login-okd-color-gray-500);
    --login-okd-button-basic-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-loader-track-color: var(--login-okd-color-gray-400);
    --login-okd-button-basic-normal-loader-mark-color: #fff;
    --login-okd-button-plain-normal-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-active-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-focus-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-default-font-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-hover-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-plain-normal-active-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-plain-normal-focus-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-plain-normal-disabled-font-color: var(--login-okd-color-gray-600);
    --login-okd-button-plain-normal-default-icon-color: var(--login-okd-color-blue-800);
    --login-okd-button-plain-normal-hover-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-plain-normal-active-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-plain-normal-focus-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-plain-normal-disabled-icon-color: var(--login-okd-color-gray-600);
    --login-okd-button-plain-normal-default-shadow: none;
    --login-okd-button-plain-normal-hover-shadow: none;
    --login-okd-button-plain-normal-active-shadow: none;
    --login-okd-button-plain-normal-focus-shadow: none;
    --login-okd-button-plain-normal-disabled-shadow: none;
    --login-okd-button-plain-red-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-hover-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-active-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-focus-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-red-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-default-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-hover-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-active-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-focus-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-disabled-font-color: rgba(249,182,199,.45);
    --login-okd-button-plain-red-default-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-hover-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-active-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-focus-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-disabled-icon-color: rgba(249,182,199,.45);
    --login-okd-button-plain-red-default-shadow: none;
    --login-okd-button-plain-red-hover-shadow: none;
    --login-okd-button-plain-red-active-shadow: none;
    --login-okd-button-plain-red-focus-shadow: none;
    --login-okd-button-plain-red-disabled-shadow: none;
    --login-okd-button-plain-green-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-hover-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-active-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-focus-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-green-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-default-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-hover-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-active-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-focus-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-disabled-font-color: rgba(165,239,190,.45);
    --login-okd-button-plain-green-default-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-hover-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-active-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-focus-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-disabled-icon-color: rgba(165,239,190,.45);
    --login-okd-button-plain-green-default-shadow: none;
    --login-okd-button-plain-green-hover-shadow: none;
    --login-okd-button-plain-green-active-shadow: none;
    --login-okd-button-plain-green-focus-shadow: none;
    --login-okd-button-plain-green-disabled-shadow: none;
    --login-okd-button-plain-orange-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-hover-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-active-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-focus-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-orange-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-default-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-hover-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-active-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-focus-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-disabled-font-color: rgba(248,116,40,.45);
    --login-okd-button-plain-orange-default-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-hover-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-active-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-focus-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-disabled-icon-color: rgba(248,116,40,.45);
    --login-okd-button-plain-orange-default-shadow: none;
    --login-okd-button-plain-orange-hover-shadow: none;
    --login-okd-button-plain-orange-active-shadow: none;
    --login-okd-button-plain-orange-focus-shadow: none;
    --login-okd-button-plain-orange-disabled-shadow: none;
    --login-okd-button-plain-yellow-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-hover-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-active-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-focus-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-plain-yellow-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-default-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-hover-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-active-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-focus-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-disabled-font-color: rgba(222,169,33,.45);
    --login-okd-button-plain-yellow-default-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-hover-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-active-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-focus-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-disabled-icon-color: rgba(222,169,33,.45);
    --login-okd-button-plain-yellow-default-shadow: none;
    --login-okd-button-plain-yellow-hover-shadow: none;
    --login-okd-button-plain-yellow-active-shadow: none;
    --login-okd-button-plain-yellow-focus-shadow: none;
    --login-okd-button-plain-yellow-disabled-shadow: none;
    --login-okd-button-xxs-font-size: var(--login-okd-font-size-xs);
    --login-okd-button-xs-font-size: var(--login-okd-font-size-xs);
    --login-okd-button-sm-font-size: var(--login-okd-font-size-md);
    --login-okd-button-md-font-size: var(--login-okd-font-size-md);
    --login-okd-button-lg-font-size: var(--login-okd-font-size-base);
    --login-okd-button-xl-font-size: 18px;
    --login-okd-button-xxs-icon-size: 14px;
    --login-okd-button-xs-icon-size: 14px;
    --login-okd-button-sm-icon-size: 18px;
    --login-okd-button-md-icon-size: 18px;
    --login-okd-button-lg-icon-size: 18px;
    --login-okd-button-xl-icon-size: 18px;
    --login-okd-button-xxs-icon-margin: 6px;
    --login-okd-button-xs-icon-margin: 6px;
    --login-okd-button-sm-icon-margin: 6px;
    --login-okd-button-md-icon-margin: 6px;
    --login-okd-button-lg-icon-margin: 8px;
    --login-okd-button-xl-icon-margin: 8px;
    --login-okd-button-xxs-line-height: var(--login-okd-line-height-xs);
    --login-okd-button-xs-line-height: var(--login-okd-line-height-xs);
    --login-okd-button-sm-line-height: var(--login-okd-line-height-md);
    --login-okd-button-md-line-height: var(--login-okd-line-height-md);
    --login-okd-button-lg-line-height: var(--login-okd-line-height-base);
    --login-okd-button-xl-line-height: var(--login-okd-line-height-base);
    --login-okd-button-xxs-padding-horizontal: 8px;
    --login-okd-button-xxs-padding-vertical: 3px;
    --login-okd-button-xs-padding-horizontal: 8px;
    --login-okd-button-xs-padding-vertical: 5px;
    --login-okd-button-sm-padding-horizontal: 12px;
    --login-okd-button-sm-padding-vertical: 7px;
    --login-okd-button-md-padding-horizontal: 16px;
    --login-okd-button-md-padding-vertical: 9px;
    --login-okd-button-lg-padding-horizontal: 24px;
    --login-okd-button-lg-padding-vertical: 13px;
    --login-okd-button-xl-padding-horizontal: 24px;
    --login-okd-button-xl-padding-vertical: 17px;
    --login-okd-button-xxs-min-width: 63px;
    --login-okd-button-xs-min-width: 63px;
    --login-okd-button-sm-min-width: 81px;
    --login-okd-button-md-min-width: 90px;
    --login-okd-button-lg-min-width: 108px;
    --login-okd-button-xl-min-width: 126px;
    --login-okd-button-xxs-border-radius: 60px;
    --login-okd-button-xs-border-radius: 60px;
    --login-okd-button-sm-border-radius: 60px;
    --login-okd-button-md-border-radius: 60px;
    --login-okd-button-lg-border-radius: 60px;
    --login-okd-button-xl-border-radius: 60px;
    --login-okd-button-xxs-border-size: 1px;
    --login-okd-button-xs-border-size: 1px;
    --login-okd-button-sm-border-size: 1px;
    --login-okd-button-md-border-size: 1px;
    --login-okd-button-lg-border-size: 1px;
    --login-okd-button-xl-border-size: 1px;
    --login-okd-button-xl-loader-size: 18px;
    --login-okd-button-lg-loader-size: 14px;
    --login-okd-button-md-loader-size: 14px;
    --login-okd-button-sm-loader-size: 14px;
    --login-okd-button-xs-loader-size: 14px;
    --login-okd-button-xxs-loader-size: 14px;
    --login-okd-button-xl-loader-text-margin-left: 8px;
    --login-okd-button-lg-loader-text-margin-left: 8px;
    --login-okd-button-md-loader-text-margin-left: 6px;
    --login-okd-button-sm-loader-text-margin-left: 6px;
    --login-okd-button-xs-loader-text-margin-left: 6px;
    --login-okd-button-xxs-loader-text-margin-left: 6px;
    --login-okd-button-s-font-size: 14px;
    --login-okd-button-s-icon-size: 18px;
    --login-okd-button-s-icon-margin: 6px;
    --login-okd-button-s-line-height: 16px;
    --login-okd-button-s-padding-horizontal: 12px;
    --login-okd-button-s-padding-vertical: 7px;
    --login-okd-button-s-min-width: 72px;
    --login-okd-button-s-border-radius: 60px;
    --login-okd-button-s-loader-size: 14px;
    --login-okd-button-s-loader-text-margin-left: 6px;
    --login-okd-button-rect-xxs-border-radius: 4px;
    --login-okd-button-rect-xs-border-radius: 4px;
    --login-okd-button-rect-sm-border-radius: 4px;
    --login-okd-button-rect-s-border-radius: 4px;
    --login-okd-button-rect-md-border-radius: 4px;
    --login-okd-button-rect-lg-border-radius: 8px;
    --login-okd-button-rect-xl-border-radius: 8px;
    --login-okd-button-fill-highlight-default-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-highlight-hover-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-highlight-active-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-highlight-focus-background: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-highlight-disabled-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-highlight-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-focus-border-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-highlight-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-highlight-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-hover-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-highlight-active-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-highlight-focus-font-color: var(--login-okd-color-gray-050);
    --login-okd-button-fill-highlight-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-highlight-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-highlight-hover-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-highlight-active-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-highlight-focus-icon-color: var(--login-okd-color-gray-050);
    --login-okd-button-fill-highlight-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-highlight-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #000,0px 0px 0px 4px #fafafa40;
    --login-okd-button-fill-highlight-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-loader-track-color: rgba(0,0,0,.26);
    --login-okd-button-fill-highlight-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-fill-highlight-border-size: 0px;
    --login-okd-button-fill-primary-default-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-hover-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-active-background: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-focus-background: var(--login-okd-color-blue-500);
    --login-okd-button-fill-primary-disabled-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-primary-default-border-color: var(--login-okd-color-container-inverse);
    --login-okd-button-fill-primary-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-primary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-primary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-primary-disabled-border-color: var(--login-okd-color-background-surface-primary);
    --login-okd-button-fill-primary-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-primary-hover-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-primary-active-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-primary-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-primary-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-fill-primary-hover-icon-color: rgba(0,0,0,.6);
    --login-okd-button-fill-primary-active-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-primary-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-primary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #121212,0px 0px 0px 4px #2676ff8c;
    --login-okd-button-fill-primary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-loader-track-color: rgba(0,0,0,.26);
    --login-okd-button-fill-primary-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-fill-primary-border-size: 0px;
    --login-okd-button-fill-secondary-default-background: hsla(0,0%,98%,.06);
    --login-okd-button-fill-secondary-hover-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-secondary-active-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-secondary-focus-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-secondary-disabled-background: hsla(0,0%,100%,.06);
    --login-okd-button-fill-secondary-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-secondary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-secondary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-secondary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-secondary-disabled-border-color: var(--login-okd-color-background-3);
    --login-okd-button-fill-secondary-default-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-secondary-hover-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-secondary-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-secondary-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-secondary-disabled-font-color: var(--login-okd-color-text-lighter);
    --login-okd-button-fill-secondary-default-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-secondary-hover-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-fill-secondary-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-secondary-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-secondary-disabled-icon-color: var(--login-okd-color-text-lighter);
    --login-okd-button-fill-secondary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #121212,0px 0px 0px 4px #ffffff1a;
    --login-okd-button-fill-secondary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-loader-track-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-secondary-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-secondary-border-size: 0px;
    --login-okd-button-fill-tertiary-border-size: 0px;
    --login-okd-button-fill-tertiary-default-background: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-hover-background: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-focus-background: hsla(0,0%,100%,.8);
    --login-okd-button-fill-tertiary-active-background: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-disabled-background: rgba(39,39,39,.06);
    --login-okd-button-fill-tertiary-default-border-color: var(--login-okd-color-container-primary);
    --login-okd-button-fill-tertiary-hover-border-color: rgba(39,39,39,0);
    --login-okd-button-fill-tertiary-focus-border-color: hsla(0,0%,100%,0);
    --login-okd-button-fill-tertiary-active-border-color: rgba(39,39,39,0);
    --login-okd-button-fill-tertiary-disabled-border-color: rgba(39,39,39,.06);
    --login-okd-button-fill-tertiary-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-tertiary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-tertiary-hover-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-hover-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-focus-font-color: var(--login-okd-color-black);
    --login-okd-button-fill-tertiary-focus-icon-color: var(--login-okd-color-black);
    --login-okd-button-fill-tertiary-active-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-active-font-color: var(--login-okd-color-content-contrast);
    --login-okd-button-fill-tertiary-disabled-icon-color: rgba(0,0,0,.36);
    --login-okd-button-fill-tertiary-disabled-font-color: rgba(0,0,0,.36);
    --login-okd-button-fill-tertiary-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-tertiary-loader-track-color: var(--login-okd-color-border-primary);
    --login-okd-button-fill-tertiary-loader-mark-color: var(--login-okd-color-border-selected);
    --login-okd-button-fill-quaternary-border-size: 0px;
    --login-okd-button-fill-quaternary-default-background: hsla(0,0%,100%,.06);
    --login-okd-button-fill-quaternary-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-default-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-default-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-hover-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-hover-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-hover-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-quaternary-focus-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-focus-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-focus-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-quaternary-active-icon-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-active-font-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-active-background: hsla(0,0%,100%,.15);
    --login-okd-button-fill-quaternary-disabled-icon-color: hsla(0,0%,100%,.3);
    --login-okd-button-fill-quaternary-disabled-font-color: hsla(0,0%,100%,.3);
    --login-okd-button-fill-quaternary-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-quaternary-disabled-background: hsla(0,0%,100%,.06);
    --login-okd-button-fill-quaternary-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-quaternary-loader-track-color: hsla(0,0%,100%,.15);
    --login-okd-button-fill-quaternary-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-quaternary-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-fill-red-default-background: var(--login-okd-color-semantic-negative);
    --login-okd-button-fill-red-hover-background: rgba(202,63,100,.8);
    --login-okd-button-fill-red-active-background: rgba(202,63,100,.8);
    --login-okd-button-fill-red-focus-background: var(--login-okd-color-red-500);
    --login-okd-button-fill-red-disabled-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-red-default-border-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-fill-red-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-red-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-red-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-red-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-red-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-red-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-red-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-red-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-red-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-red-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-red-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-red-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-fill-red-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #121212,0px 0px 0px 4px #bf474780;
    --login-okd-button-fill-red-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-loader-track-color: hsla(0,0%,100%,.15);
    --login-okd-button-fill-red-loader-mark-color: var(--login-okd-color-border-selected);
    --login-okd-button-fill-red-border-size: 0px;
    --login-okd-button-fill-green-default-background: var(--login-okd-color-semantic-positive);
    --login-okd-button-fill-green-hover-background: rgba(37,167,80,.8);
    --login-okd-button-fill-green-active-background: rgba(37,167,80,.8);
    --login-okd-button-fill-green-focus-background: var(--login-okd-color-green-500);
    --login-okd-button-fill-green-disabled-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-green-default-border-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-fill-green-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-green-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-green-focus-border-color: var(--login-okd-color-green-500);
    --login-okd-button-fill-green-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-fill-green-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-green-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-green-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-green-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-green-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-green-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-green-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-green-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-green-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-fill-green-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-focus-shadow: 0px 0px 0px 1.5px #121212,0px 0px 0px 4px #33b06a8c;
    --login-okd-button-fill-green-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-loader-track-color: hsla(0,0%,100%,.15);
    --login-okd-button-fill-green-loader-mark-color: var(--login-okd-color-border-selected);
    --login-okd-button-fill-green-border-size: 0px;
    --login-okd-button-fill-grey-default-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-grey-hover-background: var(--login-okd-color-neutral-170);
    --login-okd-button-fill-grey-active-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-grey-focus-background: rgba(64,64,64,.6);
    --login-okd-button-fill-grey-disabled-background: var(--login-okd-color-neutral-180);
    --login-okd-button-fill-grey-default-border-color: var(--login-okd-color-background-surface-primary);
    --login-okd-button-fill-grey-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-grey-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-grey-focus-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-fill-grey-disabled-border-color: var(--login-okd-color-background-surface-disable);
    --login-okd-button-fill-grey-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-grey-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-grey-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-fill-grey-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-grey-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-fill-grey-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-active-shadow: 0 0 0 0 transparent;
    --login-okd-button-fill-grey-focus-shadow: 0px 0px 0px 1.5px #121212,0px 0px 0px 4px #ffffff1a;
    --login-okd-button-fill-grey-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-loader-track-color: var(--login-okd-color-border-primary);
    --login-okd-button-fill-grey-loader-mark-color: var(--login-okd-color-border-selected);
    --login-okd-button-fill-grey-border-size: 0px;
    --login-okd-button-outline-highlight-border-size: 1px;
    --login-okd-button-outline-highlight-default-background: var(--login-okd-color-transparent-base-black);
    --login-okd-button-outline-highlight-default-border-color: var(--login-okd-color-border-selected);
    --login-okd-button-outline-highlight-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-highlight-hover-background: var(--login-okd-color-container-inverse);
    --login-okd-button-outline-highlight-hover-border-color: var(--login-okd-color-border-selected);
    --login-okd-button-outline-highlight-hover-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-focus-background: var(--login-okd-color-white);
    --login-okd-button-outline-highlight-focus-border-color: var(--login-okd-color-white);
    --login-okd-button-outline-highlight-focus-font-color: var(--login-okd-color-black);
    --login-okd-button-outline-highlight-focus-icon-color: var(--login-okd-color-black);
    --login-okd-button-outline-highlight-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-highlight-active-background: var(--login-okd-color-container-inverse);
    --login-okd-button-outline-highlight-active-border-color: var(--login-okd-color-border-selected);
    --login-okd-button-outline-highlight-active-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-active-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-highlight-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-highlight-disabled-background: var(--login-okd-color-transparent-base-black);
    --login-okd-button-outline-highlight-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-highlight-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-highlight-disabled-border-color: var(--login-okd-color-border-primary);
    --login-okd-button-outline-highlight-loader-track-color: hsla(0,0%,100%,.25);
    --login-okd-button-outline-highlight-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-outline-highlight-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-primary-default-background: var(--login-okd-color-transparent-base-black);
    --login-okd-button-outline-primary-hover-background: var(--login-okd-color-neutral-180);
    --login-okd-button-outline-primary-active-background: var(--login-okd-color-neutral-180);
    --login-okd-button-outline-primary-focus-background: var(--login-okd-color-background-3);
    --login-okd-button-outline-primary-disabled-background: var(--login-okd-color-neutral-180);
    --login-okd-button-outline-primary-default-border-color: var(--login-okd-color-border-secondary);
    --login-okd-button-outline-primary-hover-border-color: var(--login-okd-color-border-secondary);
    --login-okd-button-outline-primary-active-border-color: var(--login-okd-color-border-secondary);
    --login-okd-button-outline-primary-focus-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-primary-disabled-border-color: var(--login-okd-color-border-primary);
    --login-okd-button-outline-primary-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-outline-primary-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-primary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-primary-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-outline-primary-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-outline-primary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-focus-shadow: 0px 0px 0px 3.5px #ffffff1a;
    --login-okd-button-outline-primary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-loader-track-color: hsla(0,0%,56%,.25);
    --login-okd-button-outline-primary-loader-mark-color: #fff;
    --login-okd-button-outline-primary-border-size: 1px;
    --login-okd-button-outline-secondary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-secondary-hover-background: var(--login-okd-color-background-3);
    --login-okd-button-outline-secondary-active-background: var(--login-okd-color-background-3);
    --login-okd-button-outline-secondary-focus-background: var(--login-okd-color-background-3);
    --login-okd-button-outline-secondary-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-secondary-default-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-secondary-hover-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-secondary-active-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-secondary-focus-border-color: var(--login-okd-color-line-secondary);
    --login-okd-button-outline-secondary-disabled-border-color: var(--login-okd-color-line-muted);
    --login-okd-button-outline-secondary-default-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-hover-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-active-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-focus-font-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-disabled-font-color: var(--login-okd-color-text-lighter);
    --login-okd-button-outline-secondary-default-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-hover-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-active-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-focus-icon-color: var(--login-okd-color-text-amplifed);
    --login-okd-button-outline-secondary-disabled-icon-color: var(--login-okd-color-text-lighter);
    --login-okd-button-outline-secondary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-active-shadow: 0 0 0 0 transparent;
    --login-okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3.5px #ffffff1a;
    --login-okd-button-outline-secondary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-loader-track-color: hsla(0,0%,100%,.25);
    --login-okd-button-outline-secondary-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-outline-secondary-border-size: 1px;
    --login-okd-button-outline-tertiary-border-size: 1.5px;
    --login-okd-button-outline-tertiary-default-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-tertiary-default-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-tertiary-default-border-color: var(--login-okd-color-border-contrast);
    --login-okd-button-outline-tertiary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-tertiary-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-hover-border-color: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-hover-background: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-focus-icon-color: var(--login-okd-color-black);
    --login-okd-button-outline-tertiary-focus-font-color: var(--login-okd-color-black);
    --login-okd-button-outline-tertiary-focus-border-color: var(--login-okd-color-white);
    --login-okd-button-outline-tertiary-focus-background: var(--login-okd-color-white);
    --login-okd-button-outline-tertiary-active-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-outline-tertiary-active-border-color: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-active-background: var(--login-okd-color-container-primary);
    --login-okd-button-outline-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
    --login-okd-button-outline-tertiary-disabled-icon-color: rgba(0,0,0,.36);
    --login-okd-button-outline-tertiary-disabled-font-color: var(--login-okd-color-content-inverse);
    --login-okd-button-outline-tertiary-disabled-border-color: rgba(0,0,0,.12);
    --login-okd-button-outline-tertiary-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-tertiary-loader-mark-color: var(--login-okd-color-border-contrast);
    --login-okd-button-outline-tertiary-loader-track-color: rgba(0,0,0,.3);
    --login-okd-button-text-primary-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-hover-background: var(--login-okd-color-neutral-180);
    --login-okd-button-text-primary-active-background: var(--login-okd-color-neutral-180);
    --login-okd-button-text-primary-focus-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-primary-disabled-background: undefined;
    --login-okd-button-text-primary-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-primary-default-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-hover-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-active-font-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-focus-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-primary-disabled-font-color: var(--login-okd-color-content-disabled);
    --login-okd-button-text-primary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-hover-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-active-icon-color: var(--login-okd-color-content-primary);
    --login-okd-button-text-primary-focus-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-primary-disabled-icon-color: var(--login-okd-color-content-disabled);
    --login-okd-button-text-primary-default-shadow: none;
    --login-okd-button-text-primary-hover-shadow: none;
    --login-okd-button-text-primary-active-shadow: none;
    --login-okd-button-text-primary-focus-shadow: none;
    --login-okd-button-text-primary-disabled-shadow: none;
    --login-okd-button-text-primary-border-size: 1px;
    --login-okd-button-text-secondary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-secondary-active-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-secondary-focus-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-secondary-disabled-background: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-default-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-hover-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-active-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-focus-font-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-disabled-font-color: var(--login-okd-color-text-lighter);
    --login-okd-button-text-secondary-default-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-hover-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-active-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-focus-icon-color: var(--login-okd-color-blue-900);
    --login-okd-button-text-secondary-disabled-icon-color: var(--login-okd-color-text-lighter);
    --login-okd-button-text-secondary-default-shadow: none;
    --login-okd-button-text-secondary-hover-shadow: none;
    --login-okd-button-text-secondary-active-shadow: none;
    --login-okd-button-text-secondary-focus-shadow: none;
    --login-okd-button-text-secondary-disabled-shadow: none;
    --login-okd-button-text-secondary-border-size: 1px;
    --login-okd-button-text-red-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-hover-background: rgba(202,63,100,.05);
    --login-okd-button-text-red-active-background: rgba(202,63,100,.05);
    --login-okd-button-text-red-focus-background: var(--login-okd-color-red-050);
    --login-okd-button-text-red-disabled-background: hsla(0,0%,5%,0);
    --login-okd-button-text-red-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-red-default-font-color: var(--login-okd-color-prefer-red-text);
    --login-okd-button-text-red-hover-font-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-text-red-active-font-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-text-red-focus-font-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-disabled-font-color: rgba(202,63,100,.45);
    --login-okd-button-text-red-default-icon-color: var(--login-okd-color-prefer-red-text);
    --login-okd-button-text-red-hover-icon-color: rgba(202,63,100,.1);
    --login-okd-button-text-red-active-icon-color: var(--login-okd-color-semantic-negative);
    --login-okd-button-text-red-focus-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-disabled-icon-color: rgba(202,63,100,.45);
    --login-okd-button-text-red-default-shadow: none;
    --login-okd-button-text-red-hover-shadow: none;
    --login-okd-button-text-red-active-shadow: none;
    --login-okd-button-text-red-focus-shadow: none;
    --login-okd-button-text-red-disabled-shadow: none;
    --login-okd-button-text-red-border-size: 1px
}

.theme-light,:root {
    --login-okd-loader-line-active-color: var(--login-okd-color-border-selected);
    --login-okd-loader-line-inactive-color: var(--login-okd-color-border-primary);
    --login-okd-loader-primary-active-color: var(--login-okd-color-black);
    --login-okd-loader-primary-inactive-color: var(--login-okd-color-gray-200);
    --login-okd-loader-neutral-active-color: var(--login-okd-color-gray-700);
    --login-okd-loader-neutral-inactive-color: var(--login-okd-color-gray-200);
    --login-okd-loader-mask-bg-color: hsla(0,0%,100%,.85);
    --login-okd-loader-circle-xl-size: 38px;
    --login-okd-loader-circle-lg-size: 30px;
    --login-okd-loader-circle-md-size: 22px;
    --login-okd-loader-circle-sm-size: 14px;
    --login-okd-loader-circle-xl-track-width: 2px;
    --login-okd-loader-circle-lg-track-width: 2px;
    --login-okd-loader-circle-md-track-width: 1.82px;
    --login-okd-loader-circle-sm-track-width: 1.5px;
    --login-okd-loader-line-size: 4px;
    --login-okd-loader-circle-cover-background: var(--login-okd-color-background-1);
    --login-okd-loader-mask-text-font-size: 14px;
    --login-okd-loader-mask-text-line-height: 16px;
    --login-okd-loader-mask-text-font-weight: 400;
    --login-okd-loader-mask-text-color: var(--login-okd-color-gray-900);
    --login-okd-loader-mask-text-margin-top: 10px
}

.theme-dark {
    --login-okd-button-text-green-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-hover-background: rgba(37,167,80,.05);
    --login-okd-button-text-green-active-background: rgba(37,167,80,.05);
    --login-okd-button-text-green-focus-background: var(--login-okd-color-green-050);
    --login-okd-button-text-green-disabled-background: hsla(0,0%,5%,0);
    --login-okd-button-text-green-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-green-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-green-default-font-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-hover-font-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-active-font-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-focus-font-color: var(--login-okd-color-green-800);
    --login-okd-button-text-green-disabled-font-color: rgba(37,167,80,.45);
    --login-okd-button-text-green-default-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-hover-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-active-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-button-text-green-focus-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-text-green-disabled-icon-color: rgba(37,167,80,.45);
    --login-okd-button-text-green-default-shadow: none;
    --login-okd-button-text-green-hover-shadow: none;
    --login-okd-button-text-green-active-shadow: none;
    --login-okd-button-text-green-focus-shadow: none;
    --login-okd-button-text-green-disabled-shadow: none;
    --login-okd-button-text-green-border-size: 1px;
    --login-okd-loader-line-active-color: var(--login-okd-color-border-selected);
    --login-okd-loader-line-inactive-color: var(--login-okd-color-border-primary);
    --login-okd-loader-primary-active-color: var(--login-okd-color-gray-900);
    --login-okd-loader-primary-inactive-color: var(--login-okd-color-gray-200);
    --login-okd-loader-neutral-active-color: #fff;
    --login-okd-loader-neutral-inactive-color: #ffffff40;
    --login-okd-loader-mask-bg-color: #00000040;
    --login-okd-loader-circle-xl-size: 38px;
    --login-okd-loader-circle-lg-size: 30px;
    --login-okd-loader-circle-md-size: 22px;
    --login-okd-loader-circle-sm-size: 14px;
    --login-okd-loader-circle-xl-track-width: 2px;
    --login-okd-loader-circle-lg-track-width: 2px;
    --login-okd-loader-circle-md-track-width: 1.82px;
    --login-okd-loader-circle-sm-track-width: 1.5px;
    --login-okd-loader-line-size: 4px;
    --login-okd-loader-circle-cover-background: var(--login-okd-color-background-2);
    --login-okd-loader-mask-text-font-size: 14px;
    --login-okd-loader-mask-text-line-height: 16px;
    --login-okd-loader-mask-text-font-weight: 400;
    --login-okd-loader-mask-text-color: var(--login-okd-color-gray-900);
    --login-okd-loader-mask-text-margin-top: 10px;
    --login-okd-button-text-yellow-default-background: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-hover-background: rgba(255,177,23,.05);
    --login-okd-button-text-yellow-active-background: rgba(255,177,23,.05);
    --login-okd-button-text-yellow-focus-background: var(--login-okd-color-yellow-050);
    --login-okd-button-text-yellow-disabled-background: hsla(0,0%,5%,0);
    --login-okd-button-text-yellow-default-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-hover-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-active-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-disabled-border-color: var(--login-okd-color-common-transparent);
    --login-okd-button-text-yellow-default-font-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-hover-font-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-active-font-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-focus-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-text-yellow-disabled-font-color: rgba(255,177,23,.45);
    --login-okd-button-text-yellow-default-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-hover-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-active-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-button-text-yellow-focus-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-text-yellow-disabled-icon-color: rgba(255,177,23,.45);
    --login-okd-button-text-yellow-default-shadow: none;
    --login-okd-button-text-yellow-hover-shadow: none;
    --login-okd-button-text-yellow-active-shadow: none;
    --login-okd-button-text-yellow-focus-shadow: none;
    --login-okd-button-text-yellow-disabled-shadow: none;
    --login-okd-button-text-yellow-border-size: 1px
}

.theme-okcoin {
    --login-okd-loader-line-active-color: var(--login-okd-color-purple-1000);
    --login-okd-loader-line-inactive-color: var(--login-okd-color-gray-200);
    --login-okd-loader-primary-active-color: var(--login-okd-color-purple-1000);
    --login-okd-loader-primary-inactive-color: hsla(255,6%,87%,.24);
    --login-okd-loader-neutral-active-color: #fff;
    --login-okd-loader-neutral-inactive-color: #ffffff40;
    --login-okd-loader-mask-bg-color: hsla(0,0%,100%,.85);
    --login-okd-loader-circle-xl-size: 38px;
    --login-okd-loader-circle-lg-size: 30px;
    --login-okd-loader-circle-md-size: 22px;
    --login-okd-loader-circle-sm-size: 14px;
    --login-okd-loader-circle-xl-track-width: 2px;
    --login-okd-loader-circle-lg-track-width: 2px;
    --login-okd-loader-circle-md-track-width: 2px;
    --login-okd-loader-circle-sm-track-width: 2px;
    --login-okd-loader-line-size: 4px;
    --login-okd-loader-circle-cover-background: var(--login-okd-color-background-1);
    --login-okd-loader-mask-text-font-size: 14px;
    --login-okd-loader-mask-text-line-height: 16px;
    --login-okd-loader-mask-text-font-weight: 400;
    --login-okd-loader-mask-text-color: #000;
    --login-okd-loader-mask-text-margin-top: 10px
}

.theme-dark {
    --login-okd-button-text-orange-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-hover-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-active-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-focus-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-disabled-background: var(--login-okd-color-gray-050);
    --login-okd-button-text-orange-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-disabled-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-default-font-color: var(--login-okd-color-orange-900);
    --login-okd-button-text-orange-hover-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-active-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-focus-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-disabled-font-color: rgba(248,116,40,.45);
    --login-okd-button-text-orange-default-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-hover-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-active-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-focus-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-disabled-icon-color: rgba(248,116,40,.45);
    --login-okd-button-text-orange-default-shadow: none;
    --login-okd-button-text-orange-hover-shadow: none;
    --login-okd-button-text-orange-active-shadow: none;
    --login-okd-button-text-orange-focus-shadow: none;
    --login-okd-button-text-orange-disabled-shadow: none;
    --login-okd-button-text-orange-border-size: 1px
}

.login-a11y-text {
    clip: rect(0,0,0,0);
    border-width: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px
}

.theme-okcoin {
    --login-okd-button-primary-normal-default-background: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-hover-background: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-active-background: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-focus-background: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-primary-normal-default-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-hover-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-active-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-focus-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-primary-normal-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-primary-normal-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-hover-font-color: var(--login-okd-color-gray-400);
    --login-okd-button-primary-normal-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-normal-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-hover-icon-color: var(--login-okd-color-gray-400);
    --login-okd-button-primary-normal-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-focus-shadow: 0px 0px 0px 3px #e2dafa;
    --login-okd-button-primary-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-normal-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-primary-normal-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-primary-red-default-background: var(--login-okd-color-red-600);
    --login-okd-button-primary-red-hover-background: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-active-background: var(--login-okd-color-red-800);
    --login-okd-button-primary-red-focus-background: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-primary-red-default-border-color: var(--login-okd-color-red-600);
    --login-okd-button-primary-red-hover-border-color: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-active-border-color: var(--login-okd-color-red-800);
    --login-okd-button-primary-red-focus-border-color: var(--login-okd-color-red-700);
    --login-okd-button-primary-red-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-primary-red-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-red-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-red-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-red-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-primary-red-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-red-200);
    --login-okd-button-primary-red-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-red-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-primary-red-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-primary-green-default-background: var(--login-okd-color-green-600);
    --login-okd-button-primary-green-hover-background: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-active-background: var(--login-okd-color-green-800);
    --login-okd-button-primary-green-focus-background: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-primary-green-default-border-color: var(--login-okd-color-green-600);
    --login-okd-button-primary-green-hover-border-color: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-active-border-color: var(--login-okd-color-green-800);
    --login-okd-button-primary-green-focus-border-color: var(--login-okd-color-green-700);
    --login-okd-button-primary-green-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-primary-green-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-green-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-primary-green-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-primary-green-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-primary-green-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-focus-shadow: 0px 0px 0px 3px #93f0d1;
    --login-okd-button-primary-green-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-primary-green-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-primary-green-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-secondary-normal-default-background: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-normal-hover-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-active-background: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-normal-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-default-border-color: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-normal-hover-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-normal-focus-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-normal-default-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-hover-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-active-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-focus-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-normal-default-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-hover-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-active-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-focus-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-200);
    --login-okd-button-secondary-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-normal-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-secondary-normal-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-secondary-grey-default-background: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-grey-hover-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-active-background: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-default-border-color: var(--login-okd-color-gray-050);
    --login-okd-button-secondary-grey-hover-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-secondary-grey-focus-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-secondary-grey-default-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-hover-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-active-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-focus-font-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-grey-default-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-hover-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-active-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-focus-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-secondary-grey-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-secondary-grey-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-secondary-grey-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-focus-shadow: 0px 0px 0px 3px #dedde1;
    --login-okd-button-secondary-grey-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-secondary-grey-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-secondary-grey-loader-mark-color: var(--login-okd-color-text-white);
    --login-okd-button-basic-normal-default-background: var(--login-okd-color-transparent);
    --login-okd-button-basic-normal-hover-background: var(--login-okd-color-gray-050);
    --login-okd-button-basic-normal-active-background: var(--login-okd-color-gray-100);
    --login-okd-button-basic-normal-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-basic-normal-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-basic-normal-default-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-basic-normal-hover-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-basic-normal-active-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-basic-normal-focus-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-basic-normal-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-basic-normal-default-font-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-hover-font-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-active-font-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-focus-font-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-default-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-hover-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-active-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-focus-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-basic-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-300);
    --login-okd-button-basic-normal-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-basic-normal-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-basic-normal-loader-mark-color: var(--login-okd-color-text-black);
    --login-okd-button-plain-normal-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-plain-normal-active-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-normal-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-normal-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-normal-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-normal-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-plain-normal-default-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-plain-normal-hover-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-plain-normal-active-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-plain-normal-focus-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-plain-normal-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-normal-default-icon-color: var(--login-okd-color-gray-900);
    --login-okd-button-plain-normal-hover-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-plain-normal-active-icon-color: var(--login-okd-color-gray-900);
    --login-okd-button-plain-normal-focus-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-plain-normal-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-normal-default-shadow: none;
    --login-okd-button-plain-normal-hover-shadow: none;
    --login-okd-button-plain-normal-active-shadow: none;
    --login-okd-button-plain-normal-focus-shadow: none;
    --login-okd-button-plain-normal-disabled-shadow: none;
    --login-okd-button-plain-red-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-hover-background: var(--login-okd-color-red-050);
    --login-okd-button-plain-red-active-background: var(--login-okd-color-red-100);
    --login-okd-button-plain-red-focus-background: var(--login-okd-color-red-100);
    --login-okd-button-plain-red-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-red-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-red-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-plain-red-default-font-color: var(--login-okd-color-red-600);
    --login-okd-button-plain-red-hover-font-color: var(--login-okd-color-red-700);
    --login-okd-button-plain-red-active-font-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-focus-font-color: var(--login-okd-color-red-700);
    --login-okd-button-plain-red-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-red-default-icon-color: var(--login-okd-color-red-600);
    --login-okd-button-plain-red-hover-icon-color: var(--login-okd-color-red-700);
    --login-okd-button-plain-red-active-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-plain-red-focus-icon-color: var(--login-okd-color-red-700);
    --login-okd-button-plain-red-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-red-default-shadow: none;
    --login-okd-button-plain-red-hover-shadow: none;
    --login-okd-button-plain-red-active-shadow: none;
    --login-okd-button-plain-red-focus-shadow: none;
    --login-okd-button-plain-red-disabled-shadow: none;
    --login-okd-button-plain-green-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-hover-background: var(--login-okd-color-green-050);
    --login-okd-button-plain-green-active-background: var(--login-okd-color-green-100);
    --login-okd-button-plain-green-focus-background: var(--login-okd-color-green-100);
    --login-okd-button-plain-green-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-green-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-green-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-plain-green-default-font-color: var(--login-okd-color-green-600);
    --login-okd-button-plain-green-hover-font-color: var(--login-okd-color-green-700);
    --login-okd-button-plain-green-active-font-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-focus-font-color: var(--login-okd-color-green-700);
    --login-okd-button-plain-green-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-green-default-icon-color: var(--login-okd-color-green-600);
    --login-okd-button-plain-green-hover-icon-color: var(--login-okd-color-green-700);
    --login-okd-button-plain-green-active-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-plain-green-focus-icon-color: var(--login-okd-color-green-700);
    --login-okd-button-plain-green-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-green-default-shadow: none;
    --login-okd-button-plain-green-hover-shadow: none;
    --login-okd-button-plain-green-active-shadow: none;
    --login-okd-button-plain-green-focus-shadow: none;
    --login-okd-button-plain-green-disabled-shadow: none;
    --login-okd-button-plain-orange-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-hover-background: var(--login-okd-color-orange-050);
    --login-okd-button-plain-orange-active-background: var(--login-okd-color-orange-100);
    --login-okd-button-plain-orange-focus-background: var(--login-okd-color-orange-100);
    --login-okd-button-plain-orange-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-orange-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-orange-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-plain-orange-default-font-color: var(--login-okd-color-orange-600);
    --login-okd-button-plain-orange-hover-font-color: var(--login-okd-color-orange-700);
    --login-okd-button-plain-orange-active-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-focus-font-color: var(--login-okd-color-orange-700);
    --login-okd-button-plain-orange-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-orange-default-icon-color: var(--login-okd-color-orange-600);
    --login-okd-button-plain-orange-hover-icon-color: var(--login-okd-color-orange-700);
    --login-okd-button-plain-orange-active-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-plain-orange-focus-icon-color: var(--login-okd-color-orange-700);
    --login-okd-button-plain-orange-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-orange-default-shadow: none;
    --login-okd-button-plain-orange-hover-shadow: none;
    --login-okd-button-plain-orange-active-shadow: none;
    --login-okd-button-plain-orange-focus-shadow: none;
    --login-okd-button-plain-orange-disabled-shadow: none;
    --login-okd-button-plain-yellow-default-background: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-hover-background: var(--login-okd-color-yellow-050);
    --login-okd-button-plain-yellow-active-background: var(--login-okd-color-yellow-100);
    --login-okd-button-plain-yellow-focus-background: var(--login-okd-color-yellow-100);
    --login-okd-button-plain-yellow-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-plain-yellow-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-plain-yellow-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-plain-yellow-default-font-color: var(--login-okd-color-yellow-600);
    --login-okd-button-plain-yellow-hover-font-color: var(--login-okd-color-yellow-700);
    --login-okd-button-plain-yellow-active-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-focus-font-color: var(--login-okd-color-yellow-700);
    --login-okd-button-plain-yellow-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-yellow-default-icon-color: var(--login-okd-color-yellow-600);
    --login-okd-button-plain-yellow-hover-icon-color: var(--login-okd-color-yellow-700);
    --login-okd-button-plain-yellow-active-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-plain-yellow-focus-icon-color: var(--login-okd-color-yellow-700);
    --login-okd-button-plain-yellow-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-plain-yellow-default-shadow: none;
    --login-okd-button-plain-yellow-hover-shadow: none;
    --login-okd-button-plain-yellow-active-shadow: none;
    --login-okd-button-plain-yellow-focus-shadow: none;
    --login-okd-button-plain-yellow-disabled-shadow: none;
    --login-okd-button-xxs-font-size: var(--login-okd-font-size-xs);
    --login-okd-button-xs-font-size: var(--login-okd-font-size-xs);
    --login-okd-button-sm-font-size: var(--login-okd-font-size-md);
    --login-okd-button-md-font-size: var(--login-okd-font-size-md);
    --login-okd-button-lg-font-size: var(--login-okd-font-size-base);
    --login-okd-button-xl-font-size: var(--login-okd-font-size-base);
    --login-okd-button-xxs-icon-size: 14px;
    --login-okd-button-xs-icon-size: 14px;
    --login-okd-button-sm-icon-size: 18px;
    --login-okd-button-md-icon-size: 18px;
    --login-okd-button-lg-icon-size: 18px;
    --login-okd-button-xl-icon-size: 18px;
    --login-okd-button-xxs-icon-margin: 5px;
    --login-okd-button-xs-icon-margin: 5px;
    --login-okd-button-sm-icon-margin: 11px;
    --login-okd-button-md-icon-margin: 11px;
    --login-okd-button-lg-icon-margin: 11px;
    --login-okd-button-xl-icon-margin: 11px;
    --login-okd-button-xxs-line-height: var(--login-okd-line-height-xs);
    --login-okd-button-xs-line-height: var(--login-okd-line-height-xs);
    --login-okd-button-sm-line-height: var(--login-okd-line-height-md);
    --login-okd-button-md-line-height: var(--login-okd-line-height-md);
    --login-okd-button-lg-line-height: var(--login-okd-line-height-base);
    --login-okd-button-xl-line-height: var(--login-okd-line-height-base);
    --login-okd-button-xxs-padding-horizontal: 8px;
    --login-okd-button-xxs-padding-vertical: 3px;
    --login-okd-button-xs-padding-horizontal: 8px;
    --login-okd-button-xs-padding-vertical: 5px;
    --login-okd-button-sm-padding-horizontal: 12px;
    --login-okd-button-sm-padding-vertical: 7px;
    --login-okd-button-md-padding-horizontal: 16px;
    --login-okd-button-md-padding-vertical: 9px;
    --login-okd-button-lg-padding-horizontal: 24px;
    --login-okd-button-lg-padding-vertical: 13px;
    --login-okd-button-xl-padding-horizontal: 24px;
    --login-okd-button-xl-padding-vertical: 17px;
    --login-okd-button-xxs-min-width: 63px;
    --login-okd-button-xs-min-width: 63px;
    --login-okd-button-sm-min-width: 81px;
    --login-okd-button-md-min-width: 90px;
    --login-okd-button-lg-min-width: 108px;
    --login-okd-button-xl-min-width: 126px;
    --login-okd-button-xxs-border-radius: var(--login-okd-border-radius-sm);
    --login-okd-button-xs-border-radius: var(--login-okd-border-radius-sm);
    --login-okd-button-sm-border-radius: var(--login-okd-border-radius-sm);
    --login-okd-button-md-border-radius: var(--login-okd-border-radius-sm);
    --login-okd-button-lg-border-radius: var(--login-okd-border-radius-sm);
    --login-okd-button-xl-border-radius: var(--login-okd-border-radius-sm);
    --login-okd-button-xxs-border-size: 1px;
    --login-okd-button-xs-border-size: 1px;
    --login-okd-button-sm-border-size: 1px;
    --login-okd-button-md-border-size: 1px;
    --login-okd-button-lg-border-size: 1px;
    --login-okd-button-xl-border-size: 1px;
    --login-okd-button-fill-primary-default-background: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-hover-background: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-active-background: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-focus-background: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-primary-default-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-hover-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-active-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-focus-border-color: var(--login-okd-color-purple-1000);
    --login-okd-button-fill-primary-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-primary-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-hover-font-color: var(--login-okd-color-gray-400);
    --login-okd-button-fill-primary-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-primary-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-hover-icon-color: var(--login-okd-color-gray-400);
    --login-okd-button-fill-primary-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-primary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-primary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-focus-shadow: 0px 0px 0px 3px #e2dafa;
    --login-okd-button-fill-primary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-primary-loader-track-color: var(--login-okd-color-gray-500);
    --login-okd-button-fill-primary-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-highlight-default-background: linear-gradient(0.375turn,#aa85fa,#fe0072);
    --login-okd-button-fill-highlight-hover-background: linear-gradient(0.375turn,#7e49e0,#c32a72);
    --login-okd-button-fill-highlight-active-background: linear-gradient(0.375turn,#7e49e0,#c32a72);
    --login-okd-button-fill-highlight-focus-background: linear-gradient(0.375turn,#7e49e0,#c32a72);
    --login-okd-button-fill-highlight-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-highlight-default-border-color: transparent;
    --login-okd-button-fill-highlight-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-highlight-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-highlight-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-fill-highlight-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-highlight-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-highlight-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-highlight-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-highlight-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-focus-shadow: 0px 0px 0px 3px #fad5de;
    --login-okd-button-fill-highlight-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-highlight-loader-track-color: var(--login-okd-color-pink-300);
    --login-okd-button-fill-highlight-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-red-default-background: var(--login-okd-color-red-600);
    --login-okd-button-fill-red-hover-background: var(--login-okd-color-red-700);
    --login-okd-button-fill-red-active-background: var(--login-okd-color-red-800);
    --login-okd-button-fill-red-focus-background: var(--login-okd-color-red-700);
    --login-okd-button-fill-red-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-red-default-border-color: var(--login-okd-color-red-600);
    --login-okd-button-fill-red-hover-border-color: var(--login-okd-color-red-700);
    --login-okd-button-fill-red-active-border-color: var(--login-okd-color-red-800);
    --login-okd-button-fill-red-focus-border-color: var(--login-okd-color-red-700);
    --login-okd-button-fill-red-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-red-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-red-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-red-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-red-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-fill-red-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-red-200);
    --login-okd-button-fill-red-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-red-loader-track-color: var(--login-okd-color-red-500);
    --login-okd-button-fill-red-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-green-default-background: var(--login-okd-color-green-600);
    --login-okd-button-fill-green-hover-background: var(--login-okd-color-green-700);
    --login-okd-button-fill-green-active-background: var(--login-okd-color-green-800);
    --login-okd-button-fill-green-focus-background: var(--login-okd-color-green-700);
    --login-okd-button-fill-green-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-green-default-border-color: var(--login-okd-color-green-600);
    --login-okd-button-fill-green-hover-border-color: var(--login-okd-color-green-700);
    --login-okd-button-fill-green-active-border-color: var(--login-okd-color-green-800);
    --login-okd-button-fill-green-focus-border-color: var(--login-okd-color-green-700);
    --login-okd-button-fill-green-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-green-default-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-hover-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-active-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-focus-font-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-green-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-active-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-focus-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-fill-green-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-green-default-shadow: var(--login-okd-shadow-sm);
    --login-okd-button-fill-green-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-focus-shadow: 0px 0px 0px 3px #93f0d1;
    --login-okd-button-fill-green-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-green-loader-track-color: var(--login-okd-color-green-500);
    --login-okd-button-fill-green-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-secondary-default-background: var(--login-okd-color-gray-050);
    --login-okd-button-fill-secondary-hover-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-secondary-active-background: var(--login-okd-color-gray-200);
    --login-okd-button-fill-secondary-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-secondary-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-secondary-default-border-color: var(--login-okd-color-gray-050);
    --login-okd-button-fill-secondary-hover-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-secondary-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-fill-secondary-focus-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-secondary-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-secondary-default-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-hover-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-active-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-focus-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-secondary-default-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-hover-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-active-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-focus-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-secondary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-secondary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-200);
    --login-okd-button-fill-secondary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-secondary-loader-track-color: hsla(0,0%,100%,.24);
    --login-okd-button-fill-secondary-loader-mark-color: var(--login-okd-color-white);
    --login-okd-button-fill-grey-default-background: var(--login-okd-color-gray-050);
    --login-okd-button-fill-grey-hover-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-active-background: var(--login-okd-color-gray-200);
    --login-okd-button-fill-grey-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-default-border-color: var(--login-okd-color-gray-050);
    --login-okd-button-fill-grey-hover-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-active-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-fill-grey-focus-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-default-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-hover-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-active-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-focus-font-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-grey-default-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-hover-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-active-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-focus-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-fill-grey-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
    --login-okd-button-fill-grey-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-focus-shadow: 0px 0px 0px 3px #dedde1;
    --login-okd-button-fill-grey-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-fill-grey-loader-track-color: var(--login-okd-color-gray-100);
    --login-okd-button-fill-grey-loader-mark-color: var(--login-okd-color-gray-500);
    --login-okd-button-outline-primary-default-background: var(--login-okd-color-white);
    --login-okd-button-outline-primary-hover-background: var(--login-okd-color-gray-050);
    --login-okd-button-outline-primary-active-background: var(--login-okd-color-gray-100);
    --login-okd-button-outline-primary-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-outline-primary-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-outline-primary-default-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-primary-hover-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-outline-primary-active-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-outline-primary-focus-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-outline-primary-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-outline-primary-default-font-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-hover-font-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-active-font-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-focus-font-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-outline-primary-default-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-hover-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-active-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-focus-icon-color: var(--login-okd-color-text-black);
    --login-okd-button-outline-primary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-outline-primary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-300);
    --login-okd-button-outline-primary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-primary-loader-track-color: var(--login-okd-color-gray-100);
    --login-okd-button-outline-primary-loader-mark-color: var(--login-okd-color-gray-500);
    --login-okd-button-outline-secondary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-outline-secondary-hover-background: var(--login-okd-color-gray-050);
    --login-okd-button-outline-secondary-active-background: var(--login-okd-color-gray-100);
    --login-okd-button-outline-secondary-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-outline-secondary-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-outline-secondary-default-border-color: var(--login-okd-color-gray-200);
    --login-okd-button-outline-secondary-hover-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-outline-secondary-active-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-outline-secondary-focus-border-color: var(--login-okd-color-gray-400);
    --login-okd-button-outline-secondary-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-outline-secondary-default-font-color: var(--login-okd-color-purple-1000);
    --login-okd-button-outline-secondary-hover-font-color: var(--login-okd-color-purple-1000);
    --login-okd-button-outline-secondary-active-font-color: var(--login-okd-color-purple-1000);
    --login-okd-button-outline-secondary-focus-font-color: var(--login-okd-color-purple-1000);
    --login-okd-button-outline-secondary-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-outline-secondary-default-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-outline-secondary-hover-icon-color: var(--login-okd-color-text-white);
    --login-okd-button-outline-secondary-active-icon-color: var(--login-okd-color-purple-1000);
    --login-okd-button-outline-secondary-focus-icon-color: var(--login-okd-color-purple-1000);
    --login-okd-button-outline-secondary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-outline-secondary-default-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-hover-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-active-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3px var(--login-okd-color-gray-300);
    --login-okd-button-outline-secondary-disabled-shadow: var(--login-okd-shadow-none);
    --login-okd-button-outline-secondary-loader-track-color: var(--login-okd-color-gray-100);
    --login-okd-button-outline-secondary-loader-mark-color: var(--login-okd-color-gray-500);
    --login-okd-button-text-primary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-hover-background: var(--login-okd-color-blue-050);
    --login-okd-button-text-primary-active-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-primary-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-primary-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-primary-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-primary-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-text-primary-default-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-text-primary-hover-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-primary-active-font-color: var(--login-okd-color-gray-900);
    --login-okd-button-text-primary-focus-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-primary-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-primary-default-icon-color: var(--login-okd-color-gray-900);
    --login-okd-button-text-primary-hover-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-primary-active-icon-color: var(--login-okd-color-gray-900);
    --login-okd-button-text-primary-focus-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-primary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-primary-default-shadow: none;
    --login-okd-button-text-primary-hover-shadow: none;
    --login-okd-button-text-primary-active-shadow: none;
    --login-okd-button-text-primary-focus-shadow: none;
    --login-okd-button-text-primary-disabled-shadow: none;
    --login-okd-button-text-secondary-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-hover-background: var(--login-okd-color-gray-050);
    --login-okd-button-text-secondary-active-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-secondary-focus-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-secondary-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-secondary-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-secondary-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-text-secondary-default-font-color: var(--login-okd-color-gray-600);
    --login-okd-button-text-secondary-hover-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-secondary-active-font-color: var(--login-okd-color-gray-800);
    --login-okd-button-text-secondary-focus-font-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-secondary-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-secondary-default-icon-color: var(--login-okd-color-gray-600);
    --login-okd-button-text-secondary-hover-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-secondary-active-icon-color: var(--login-okd-color-gray-800);
    --login-okd-button-text-secondary-focus-icon-color: var(--login-okd-color-gray-700);
    --login-okd-button-text-secondary-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-secondary-default-shadow: none;
    --login-okd-button-text-secondary-hover-shadow: none;
    --login-okd-button-text-secondary-active-shadow: none;
    --login-okd-button-text-secondary-focus-shadow: none;
    --login-okd-button-text-secondary-disabled-shadow: none;
    --login-okd-button-text-red-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-red-hover-background: var(--login-okd-color-red-050);
    --login-okd-button-text-red-active-background: var(--login-okd-color-red-100);
    --login-okd-button-text-red-focus-background: var(--login-okd-color-red-100);
    --login-okd-button-text-red-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-red-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-red-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-text-red-default-font-color: var(--login-okd-color-red-600);
    --login-okd-button-text-red-hover-font-color: var(--login-okd-color-red-700);
    --login-okd-button-text-red-active-font-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-focus-font-color: var(--login-okd-color-red-700);
    --login-okd-button-text-red-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-red-default-icon-color: var(--login-okd-color-red-600);
    --login-okd-button-text-red-hover-icon-color: var(--login-okd-color-red-700);
    --login-okd-button-text-red-active-icon-color: var(--login-okd-color-red-800);
    --login-okd-button-text-red-focus-icon-color: var(--login-okd-color-red-700);
    --login-okd-button-text-red-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-red-default-shadow: none;
    --login-okd-button-text-red-hover-shadow: none;
    --login-okd-button-text-red-active-shadow: none;
    --login-okd-button-text-red-focus-shadow: none;
    --login-okd-button-text-red-disabled-shadow: none;
    --login-okd-button-text-green-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-green-hover-background: var(--login-okd-color-green-050);
    --login-okd-button-text-green-active-background: var(--login-okd-color-green-100);
    --login-okd-button-text-green-focus-background: var(--login-okd-color-green-100);
    --login-okd-button-text-green-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-green-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-green-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-green-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-green-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-green-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-text-green-default-font-color: var(--login-okd-color-green-600);
    --login-okd-button-text-green-hover-font-color: var(--login-okd-color-green-700);
    --login-okd-button-text-green-active-font-color: var(--login-okd-color-green-800);
    --login-okd-button-text-green-focus-font-color: var(--login-okd-color-green-700);
    --login-okd-button-text-green-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-green-default-icon-color: var(--login-okd-color-green-600);
    --login-okd-button-text-green-hover-icon-color: var(--login-okd-color-green-700);
    --login-okd-button-text-green-active-icon-color: var(--login-okd-color-green-800);
    --login-okd-button-text-green-focus-icon-color: var(--login-okd-color-green-700);
    --login-okd-button-text-green-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-green-default-shadow: none;
    --login-okd-button-text-green-hover-shadow: none;
    --login-okd-button-text-green-active-shadow: none;
    --login-okd-button-text-green-focus-shadow: none;
    --login-okd-button-text-green-disabled-shadow: none;
    --login-okd-button-text-orange-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-hover-background: var(--login-okd-color-orange-050);
    --login-okd-button-text-orange-active-background: var(--login-okd-color-orange-100);
    --login-okd-button-text-orange-focus-background: var(--login-okd-color-orange-100);
    --login-okd-button-text-orange-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-orange-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-orange-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-text-orange-default-font-color: var(--login-okd-color-orange-600);
    --login-okd-button-text-orange-hover-font-color: var(--login-okd-color-orange-700);
    --login-okd-button-text-orange-active-font-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-focus-font-color: var(--login-okd-color-orange-700);
    --login-okd-button-text-orange-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-orange-default-icon-color: var(--login-okd-color-orange-600);
    --login-okd-button-text-orange-hover-icon-color: var(--login-okd-color-orange-700);
    --login-okd-button-text-orange-active-icon-color: var(--login-okd-color-orange-800);
    --login-okd-button-text-orange-focus-icon-color: var(--login-okd-color-orange-700);
    --login-okd-button-text-orange-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-orange-default-shadow: none;
    --login-okd-button-text-orange-hover-shadow: none;
    --login-okd-button-text-orange-active-shadow: none;
    --login-okd-button-text-orange-focus-shadow: none;
    --login-okd-button-text-orange-disabled-shadow: none;
    --login-okd-button-text-yellow-default-background: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-hover-background: var(--login-okd-color-yellow-050);
    --login-okd-button-text-yellow-active-background: var(--login-okd-color-yellow-100);
    --login-okd-button-text-yellow-focus-background: var(--login-okd-color-yellow-100);
    --login-okd-button-text-yellow-disabled-background: var(--login-okd-color-gray-100);
    --login-okd-button-text-yellow-default-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-hover-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-active-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-focus-border-color: var(--login-okd-color-transparent);
    --login-okd-button-text-yellow-disabled-border-color: var(--login-okd-color-gray-100);
    --login-okd-button-text-yellow-default-font-color: var(--login-okd-color-yellow-600);
    --login-okd-button-text-yellow-hover-font-color: var(--login-okd-color-yellow-700);
    --login-okd-button-text-yellow-active-font-color: var(--login-okd-color-yellow-800);
    --login-okd-button-text-yellow-focus-font-color: var(--login-okd-color-yellow-700);
    --login-okd-button-text-yellow-disabled-font-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-yellow-default-icon-color: var(--login-okd-color-yellow-600);
    --login-okd-button-text-yellow-hover-icon-color: var(--login-okd-color-yellow-700);
    --login-okd-button-text-yellow-active-icon-color: var(--login-okd-color-yellow-800);
    --login-okd-button-text-yellow-focus-icon-color: var(--login-okd-color-yellow-700);
    --login-okd-button-text-yellow-disabled-icon-color: var(--login-okd-color-gray-300);
    --login-okd-button-text-yellow-default-shadow: none;
    --login-okd-button-text-yellow-hover-shadow: none;
    --login-okd-button-text-yellow-active-shadow: none;
    --login-okd-button-text-yellow-focus-shadow: none;
    --login-okd-button-text-yellow-disabled-shadow: none;
    --login-okd-button-fill-primary-border-size: 0px;
    --login-okd-button-fill-secondary-border-size: 0px;
    --login-okd-button-fill-highlight-border-size: 0px;
    --login-okd-button-fill-red-border-size: 0px;
    --login-okd-button-fill-green-border-size: 0px;
    --login-okd-button-fill-grey-border-size: 0px;
    --login-okd-button-outline-primary-border-size: 1px;
    --login-okd-button-outline-secondary-border-size: 1px;
    --login-okd-button-text-primary-border-size: 1px;
    --login-okd-button-text-secondary-border-size: 1px;
    --login-okd-button-text-red-border-size: 1px;
    --login-okd-button-text-green-border-size: 1px;
    --login-okd-button-text-orange-border-size: 1px;
    --login-okd-button-text-yellow-border-size: 1px;
    --login-okd-button-xl-loader-size: 18px;
    --login-okd-button-lg-loader-size: 14px;
    --login-okd-button-md-loader-size: 14px;
    --login-okd-button-sm-loader-size: 14px;
    --login-okd-button-xs-loader-size: 14px;
    --login-okd-button-xxs-loader-size: 14px;
    --login-okd-button-xl-loader-text-margin-left: 4px;
    --login-okd-button-lg-loader-text-margin-left: 4px;
    --login-okd-button-md-loader-text-margin-left: 4px;
    --login-okd-button-sm-loader-text-margin-left: 4px;
    --login-okd-button-xs-loader-text-margin-left: 4px;
    --login-okd-button-xxs-loader-text-margin-left: 4px;
    --login-okd-button-s-loader-text-margin-left: 4px;
    --login-okd-button-s-loader-size: 14px;
    --login-okd-button-s-border-radius: 4px;
    --login-okd-button-s-min-width: 72px;
    --login-okd-button-s-padding-vertical: 7px;
    --login-okd-button-s-padding-horizontal: 12px;
    --login-okd-button-s-line-height: 16px;
    --login-okd-button-s-icon-margin: 11px;
    --login-okd-button-s-icon-size: 18px;
    --login-okd-button-s-font-size: 14px;
    --login-okd-button-outline-tertiary-border-size: 1px;
    --login-okd-button-rect-xxs-border-radius: 4px;
    --login-okd-button-rect-xs-border-radius: 4px;
    --login-okd-button-rect-sm-border-radius: 4px;
    --login-okd-button-rect-s-border-radius: 4px;
    --login-okd-button-rect-md-border-radius: 4px;
    --login-okd-button-rect-lg-border-radius: 8px;
    --login-okd-button-rect-xl-border-radius: 8px;
    --login-okd-button-fill-tertiary-border-size: 0px;
    --login-okd-button-fill-quaternary-border-size: 0px
}

@keyframes loadingLine {
    to {
        left: 100%
    }
}

.login-loader-line {
    background: var(--login-okd-loader-line-inactive-color);
    border-radius: calc(var(--login-okd-loader-line-size)/2);
    height: var(--login-okd-loader-line-size);
    overflow: hidden;
    position: relative;
    width: 100%
}

.login-loader-line .login-loader-mark {
    background: var(--login-okd-loader-line-active-color);
    border-radius: calc(var(--login-okd-loader-line-size)/2);
    height: 100%
}

.login-loader-line.login-loader-loading .login-loader-mark {
    animation: loadingLine 2s linear infinite;
    left: -25%;
    position: absolute;
    top: 0
}

@keyframes okui-loader-rotation {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(1turn)
    }
}

.login-loader-box {
    position: relative
}

.login-loader-mask {
    align-items: center;
    background: var(--login-okd-loader-mask-bg-color);
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.login-loader-mask-text {
    color: var(--login-okd-loader-mask-text-color);
    font-size: var(--login-okd-loader-mask-text-font-size);
    font-weight: var(--login-okd-loader-mask-text-font-weight);
    line-height: var(--login-okd-loader-mask-text-line-height);
    margin-top: var(--login-okd-loader-mask-text-margin-top)
}

.login-loader-spin {
    animation: okui-loader-rotation 1s linear infinite;
    background-color: initial;
    border-style: solid;
    box-sizing: border-box;
    display: inline-flex
}

.login-loader-spin-xl {
    border-radius: var(--login-okd-loader-circle-xl-size);
    border-width: var(--login-okd-loader-circle-xl-track-width);
    height: var(--login-okd-loader-circle-xl-size);
    width: var(--login-okd-loader-circle-xl-size)
}

.login-loader-spin-lg {
    border-radius: var(--login-okd-loader-circle-lg-size);
    border-width: var(--login-okd-loader-circle-lg-track-width);
    height: var(--login-okd-loader-circle-lg-size);
    width: var(--login-okd-loader-circle-lg-size)
}

.login-loader-spin-md {
    border-radius: var(--login-okd-loader-circle-md-size);
    border-width: var(--login-okd-loader-circle-md-track-width);
    height: var(--login-okd-loader-circle-md-size);
    width: var(--login-okd-loader-circle-md-size)
}

.login-loader-spin-sm {
    border-radius: var(--login-okd-loader-circle-sm-size);
    border-width: var(--login-okd-loader-circle-sm-track-width);
    height: var(--login-okd-loader-circle-sm-size);
    width: var(--login-okd-loader-circle-sm-size)
}

.login-loader-spin-primary {
    border-color: var(--login-okd-loader-primary-inactive-color);
    border-top-color: var(--login-okd-loader-primary-active-color)
}

.login-loader-spin-neutral {
    border-color: var(--login-okd-loader-neutral-inactive-color);
    border-top-color: var(--login-okd-loader-neutral-active-color)
}

.login-loader-inner-circle {
    border: none;
    border-radius: 0;
    overflow: hidden;
    transform: rotate(180deg)
}

.login-loader-inner-fill-primary {
    background: var(--login-okd-loader-primary-active-color)
}

.login-loader-inner-fill-neutral {
    background: var(--login-okd-loader-neutral-active-color)
}

.login-loader-inner-track-primary {
    background: var(--login-okd-loader-primary-inactive-color)
}

.login-loader-inner-track-neutral {
    background: var(--login-okd-loader-neutral-inactive-color)
}

.login-loader-inner-track-right {
    height: 100%;
    overflow: hidden;
    position: absolute;
    right: 0
}

.login-loader-inner-track-right-content {
    content: "";
    height: 100%;
    position: absolute;
    transform: rotate(0deg);
    transform-origin: left center;
    width: 100%
}

.login-loader-inner-track-left {
    height: 100%;
    overflow: hidden;
    position: absolute
}

.login-loader-inner-track-left-content {
    content: "";
    height: 100%;
    position: absolute;
    transform: rotate(0deg);
    transform-origin: right center;
    width: 100%
}

.login-loader-inner-xl {
    border-radius: var(--login-okd-loader-circle-xl-size);
    height: var(--login-okd-loader-circle-xl-size);
    width: var(--login-okd-loader-circle-xl-size)
}

.login-loader-inner-xl-cover {
    background-color: var(--login-okd-loader-circle-cover-background);
    border-radius: 100%;
    height: calc(var(--login-okd-loader-circle-xl-size) - var(--login-okd-loader-circle-xl-track-width)*2);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: calc(var(--login-okd-loader-circle-xl-size) - var(--login-okd-loader-circle-xl-track-width)*2)
}

.login-loader-inner-track-xl {
    width: calc(var(--login-okd-loader-circle-xl-size)/2)
}

.login-loader-inner-track-xl-inner-track-left-content {
    border-radius: calc(var(--login-okd-loader-circle-xl-size)/2) 0 0 calc(var(--login-okd-loader-circle-xl-size)/2);
    width: 100%
}

.login-loader-inner-track-xl-inner-track-right-content {
    border-radius: 0 calc(var(--login-okd-loader-circle-xl-size)/2) calc(var(--login-okd-loader-circle-xl-size)/2) 0;
    width: 100%
}

.login-loader-inner-lg {
    border-radius: var(--login-okd-loader-circle-lg-size);
    height: var(--login-okd-loader-circle-lg-size);
    width: var(--login-okd-loader-circle-lg-size)
}

.login-loader-inner-lg-cover {
    background-color: var(--login-okd-loader-circle-cover-background);
    border-radius: 100%;
    height: calc(var(--login-okd-loader-circle-lg-size) - var(--login-okd-loader-circle-lg-track-width)*2);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: calc(var(--login-okd-loader-circle-lg-size) - var(--login-okd-loader-circle-lg-track-width)*2)
}

.login-loader-inner-track-lg {
    width: calc(var(--login-okd-loader-circle-lg-size)/2)
}

.login-loader-inner-track-lg-inner-track-left-content {
    border-radius: calc(var(--login-okd-loader-circle-lg-size)/2) 0 0 calc(var(--login-okd-loader-circle-lg-size)/2);
    width: 100%
}

.login-loader-inner-track-lg-inner-track-right-content {
    border-radius: 0 calc(var(--login-okd-loader-circle-lg-size)/2) calc(var(--login-okd-loader-circle-lg-size)/2) 0;
    width: 100%
}

.login-loader-inner-md {
    border-radius: var(--login-okd-loader-circle-md-size);
    height: var(--login-okd-loader-circle-md-size);
    width: var(--login-okd-loader-circle-md-size)
}

.login-loader-inner-md-cover {
    background-color: var(--login-okd-loader-circle-cover-background);
    border-radius: 100%;
    height: calc(var(--login-okd-loader-circle-md-size) - var(--login-okd-loader-circle-md-track-width)*2);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: calc(var(--login-okd-loader-circle-md-size) - var(--login-okd-loader-circle-md-track-width)*2)
}

.login-loader-inner-track-md {
    width: calc(var(--login-okd-loader-circle-md-size)/2)
}

.login-loader-inner-track-md-inner-track-left-content {
    border-radius: calc(var(--login-okd-loader-circle-md-size)/2) 0 0 calc(var(--login-okd-loader-circle-md-size)/2);
    width: 100%
}

.login-loader-inner-track-md-inner-track-right-content {
    border-radius: 0 calc(var(--login-okd-loader-circle-md-size)/2) calc(var(--login-okd-loader-circle-md-size)/2) 0;
    width: 100%
}

.login-loader-inner-sm {
    border-radius: var(--login-okd-loader-circle-sm-size);
    height: var(--login-okd-loader-circle-sm-size);
    width: var(--login-okd-loader-circle-sm-size)
}

.login-loader-inner-sm-cover {
    background-color: var(--login-okd-loader-circle-cover-background);
    border-radius: 100%;
    height: calc(var(--login-okd-loader-circle-sm-size) - var(--login-okd-loader-circle-sm-track-width)*2);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: calc(var(--login-okd-loader-circle-sm-size) - var(--login-okd-loader-circle-sm-track-width)*2)
}

.login-loader-inner-track-sm {
    width: calc(var(--login-okd-loader-circle-sm-size)/2)
}

.login-loader-inner-track-sm-inner-track-left-content {
    border-radius: calc(var(--login-okd-loader-circle-sm-size)/2) 0 0 calc(var(--login-okd-loader-circle-sm-size)/2);
    width: 100%
}

.login-loader-inner-track-sm-inner-track-right-content {
    border-radius: 0 calc(var(--login-okd-loader-circle-sm-size)/2) calc(var(--login-okd-loader-circle-sm-size)/2) 0;
    width: 100%
}

.login-powerLink {
    color: inherit;
    text-decoration: none
}

.login-powerLink-a11y:focus-visible {
    border-radius: 2px;
    outline: 2px solid var(--login-okd-color-border-focus);
    outline-color: var(--login-okd-color-border-focus);
    outline-offset: 2px;
    outline-style: solid;
    outline-width: 2px
}

.login-btn {
    -webkit-tap-highlight-color: transparent;
    align-items: center;
    -webkit-appearance: none;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-weight: 500;
    justify-content: center;
    outline: none;
    position: relative;
    text-decoration: none;
    touch-action: manipulation;
    transition: background-color .3s cubic-bezier(.165,.84,.44,1),border-color .3s cubic-bezier(.165,.84,.44,1);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.login-btn:focus-visible {
    outline: 2px solid var(--login-okd-color-border-focus);
    outline-color: var(--login-okd-color-border-focus);
    outline-offset: 2px;
    outline-style: solid;
    outline-width: 2px
}

.login-btn.btn-fill-highlight {
    background: var(--login-okd-button-fill-highlight-default-background);
    border-color: var(--login-okd-button-fill-highlight-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-highlight-border-size);
    box-shadow: var(--login-okd-button-fill-highlight-default-shadow);
    color: var(--login-okd-button-fill-highlight-default-font-color)
}

.login-btn.btn-fill-highlight.hover,.login-btn.btn-fill-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-highlight-hover-background);
    border-color: var(--login-okd-button-fill-highlight-hover-border-color);
    box-shadow: var(--login-okd-button-fill-highlight-hover-shadow);
    color: var(--login-okd-button-fill-highlight-hover-font-color)
}

.login-btn.btn-fill-highlight.hover .btn-icon,.login-btn.btn-fill-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-highlight-hover-icon-color)
}

.login-btn.btn-fill-highlight.active,.login-btn.btn-fill-highlight:not(:disabled):active {
    background: var(--login-okd-button-fill-highlight-active-background);
    border-color: var(--login-okd-button-fill-highlight-active-border-color);
    box-shadow: var(--login-okd-button-fill-highlight-active-shadow);
    color: var(--login-okd-button-fill-highlight-active-font-color);
    transition: none
}

.login-btn.btn-fill-highlight.active .btn-icon,.login-btn.btn-fill-highlight:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-highlight-active-icon-color)
}

.login-btn.btn-fill-highlight:not(.loading).btn-disabled,.login-btn.btn-fill-highlight:not(.loading):disabled {
    background: var(--login-okd-button-fill-highlight-disabled-background);
    border-color: var(--login-okd-button-fill-highlight-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-highlight-disabled-shadow);
    color: var(--login-okd-button-fill-highlight-disabled-font-color)
}

.login-btn.btn-fill-highlight:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-highlight:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-highlight-disabled-icon-color)
}

.login-btn.btn-fill-highlight.loading {
    cursor: pointer
}

.login-btn.btn-fill-highlight .btn-icon {
    color: var(--login-okd-button-fill-highlight-default-icon-color)
}

.login-btn.btn-fill-highlight .login-btn-loader-text {
    color: var(--login-okd-button-fill-highlight-default-font-color)
}

.login-btn.btn-fill-highlight.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-highlight.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-highlight.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-highlight.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-highlight.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-highlight.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-highlight.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-highlight-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-highlight.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-highlight-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-highlight-border-size)*2)
}

.login-btn.btn-fill-highlight.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary {
    background: var(--login-okd-button-fill-primary-default-background);
    border-color: var(--login-okd-button-fill-primary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-primary-border-size);
    box-shadow: var(--login-okd-button-fill-primary-default-shadow);
    color: var(--login-okd-button-fill-primary-default-font-color)
}

.login-btn.btn-fill-primary.hover,.login-btn.btn-fill-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-primary-hover-background);
    border-color: var(--login-okd-button-fill-primary-hover-border-color);
    box-shadow: var(--login-okd-button-fill-primary-hover-shadow);
    color: var(--login-okd-button-fill-primary-hover-font-color)
}

.login-btn.btn-fill-primary.hover .btn-icon,.login-btn.btn-fill-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-primary-hover-icon-color)
}

.login-btn.btn-fill-primary.active,.login-btn.btn-fill-primary:not(:disabled):active {
    background: var(--login-okd-button-fill-primary-active-background);
    border-color: var(--login-okd-button-fill-primary-active-border-color);
    box-shadow: var(--login-okd-button-fill-primary-active-shadow);
    color: var(--login-okd-button-fill-primary-active-font-color);
    transition: none
}

.login-btn.btn-fill-primary.active .btn-icon,.login-btn.btn-fill-primary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-primary-active-icon-color)
}

.login-btn.btn-fill-primary:not(.loading).btn-disabled,.login-btn.btn-fill-primary:not(.loading):disabled {
    background: var(--login-okd-button-fill-primary-disabled-background);
    border-color: var(--login-okd-button-fill-primary-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-primary-disabled-shadow);
    color: var(--login-okd-button-fill-primary-disabled-font-color)
}

.login-btn.btn-fill-primary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-primary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-primary-disabled-icon-color)
}

.login-btn.btn-fill-primary.loading {
    cursor: pointer
}

.login-btn.btn-fill-primary .btn-icon {
    color: var(--login-okd-button-fill-primary-default-icon-color)
}

.login-btn.btn-fill-primary .login-btn-loader-text {
    color: var(--login-okd-button-fill-primary-default-font-color)
}

.login-btn.btn-fill-primary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-primary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-primary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-primary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-primary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-primary-border-size)*2)
}

.login-btn.btn-fill-primary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary {
    background: var(--login-okd-button-fill-secondary-default-background);
    border-color: var(--login-okd-button-fill-secondary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-secondary-border-size);
    box-shadow: var(--login-okd-button-fill-secondary-default-shadow);
    color: var(--login-okd-button-fill-secondary-default-font-color)
}

.login-btn.btn-fill-secondary.hover,.login-btn.btn-fill-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-secondary-hover-background);
    border-color: var(--login-okd-button-fill-secondary-hover-border-color);
    box-shadow: var(--login-okd-button-fill-secondary-hover-shadow);
    color: var(--login-okd-button-fill-secondary-hover-font-color)
}

.login-btn.btn-fill-secondary.hover .btn-icon,.login-btn.btn-fill-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-secondary-hover-icon-color)
}

.login-btn.btn-fill-secondary.active,.login-btn.btn-fill-secondary:not(:disabled):active {
    background: var(--login-okd-button-fill-secondary-active-background);
    border-color: var(--login-okd-button-fill-secondary-active-border-color);
    box-shadow: var(--login-okd-button-fill-secondary-active-shadow);
    color: var(--login-okd-button-fill-secondary-active-font-color);
    transition: none
}

.login-btn.btn-fill-secondary.active .btn-icon,.login-btn.btn-fill-secondary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-secondary-active-icon-color)
}

.login-btn.btn-fill-secondary:not(.loading).btn-disabled,.login-btn.btn-fill-secondary:not(.loading):disabled {
    background: var(--login-okd-button-fill-secondary-disabled-background);
    border-color: var(--login-okd-button-fill-secondary-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-secondary-disabled-shadow);
    color: var(--login-okd-button-fill-secondary-disabled-font-color)
}

.login-btn.btn-fill-secondary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-secondary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-secondary-disabled-icon-color)
}

.login-btn.btn-fill-secondary.loading {
    cursor: pointer
}

.login-btn.btn-fill-secondary .btn-icon {
    color: var(--login-okd-button-fill-secondary-default-icon-color)
}

.login-btn.btn-fill-secondary .login-btn-loader-text {
    color: var(--login-okd-button-fill-secondary-default-font-color)
}

.login-btn.btn-fill-secondary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-secondary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-secondary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-secondary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-secondary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-secondary-border-size)*2)
}

.login-btn.btn-fill-secondary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary {
    background: var(--login-okd-button-fill-tertiary-default-background);
    border-color: var(--login-okd-button-fill-tertiary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-tertiary-border-size);
    box-shadow: var(--login-okd-button-fill-tertiary-default-shadow);
    color: var(--login-okd-button-fill-tertiary-default-font-color)
}

.login-btn.btn-fill-tertiary.hover,.login-btn.btn-fill-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-tertiary-hover-background);
    border-color: var(--login-okd-button-fill-tertiary-hover-border-color);
    box-shadow: var(--login-okd-button-fill-tertiary-hover-shadow);
    color: var(--login-okd-button-fill-tertiary-hover-font-color)
}

.login-btn.btn-fill-tertiary.hover .btn-icon,.login-btn.btn-fill-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-tertiary-hover-icon-color)
}

.login-btn.btn-fill-tertiary.active,.login-btn.btn-fill-tertiary:not(:disabled):active {
    background: var(--login-okd-button-fill-tertiary-active-background);
    border-color: var(--login-okd-button-fill-tertiary-active-border-color);
    box-shadow: var(--login-okd-button-fill-tertiary-active-shadow);
    color: var(--login-okd-button-fill-tertiary-active-font-color);
    transition: none
}

.login-btn.btn-fill-tertiary.active .btn-icon,.login-btn.btn-fill-tertiary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-tertiary-active-icon-color)
}

.login-btn.btn-fill-tertiary:not(.loading).btn-disabled,.login-btn.btn-fill-tertiary:not(.loading):disabled {
    background: var(--login-okd-button-fill-tertiary-disabled-background);
    border-color: var(--login-okd-button-fill-tertiary-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-tertiary-disabled-shadow);
    color: var(--login-okd-button-fill-tertiary-disabled-font-color)
}

.login-btn.btn-fill-tertiary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-tertiary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-tertiary-disabled-icon-color)
}

.login-btn.btn-fill-tertiary.loading {
    cursor: pointer
}

.login-btn.btn-fill-tertiary .btn-icon {
    color: var(--login-okd-button-fill-tertiary-default-icon-color)
}

.login-btn.btn-fill-tertiary .login-btn-loader-text {
    color: var(--login-okd-button-fill-tertiary-default-font-color)
}

.login-btn.btn-fill-tertiary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-tertiary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-tertiary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-tertiary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-tertiary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-tertiary-border-size)*2)
}

.login-btn.btn-fill-tertiary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary {
    background: var(--login-okd-button-fill-quaternary-default-background);
    border-color: var(--login-okd-button-fill-quaternary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-quaternary-border-size);
    box-shadow: var(--login-okd-button-fill-quaternary-default-shadow);
    color: var(--login-okd-button-fill-quaternary-default-font-color)
}

.login-btn.btn-fill-quaternary.hover,.login-btn.btn-fill-quaternary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-quaternary-hover-background);
    border-color: var(--login-okd-button-fill-quaternary-hover-border-color);
    box-shadow: var(--login-okd-button-fill-quaternary-hover-shadow);
    color: var(--login-okd-button-fill-quaternary-hover-font-color)
}

.login-btn.btn-fill-quaternary.hover .btn-icon,.login-btn.btn-fill-quaternary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-quaternary-hover-icon-color)
}

.login-btn.btn-fill-quaternary.active,.login-btn.btn-fill-quaternary:not(:disabled):active {
    background: var(--login-okd-button-fill-quaternary-active-background);
    border-color: var(--login-okd-button-fill-quaternary-active-border-color);
    box-shadow: var(--login-okd-button-fill-quaternary-active-shadow);
    color: var(--login-okd-button-fill-quaternary-active-font-color);
    transition: none
}

.login-btn.btn-fill-quaternary.active .btn-icon,.login-btn.btn-fill-quaternary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-quaternary-active-icon-color)
}

.login-btn.btn-fill-quaternary:not(.loading).btn-disabled,.login-btn.btn-fill-quaternary:not(.loading):disabled {
    background: var(--login-okd-button-fill-quaternary-disabled-background);
    border-color: var(--login-okd-button-fill-quaternary-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-quaternary-disabled-shadow);
    color: var(--login-okd-button-fill-quaternary-disabled-font-color)
}

.login-btn.btn-fill-quaternary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-quaternary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-quaternary-disabled-icon-color)
}

.login-btn.btn-fill-quaternary.loading {
    cursor: pointer
}

.login-btn.btn-fill-quaternary .btn-icon {
    color: var(--login-okd-button-fill-quaternary-default-icon-color)
}

.login-btn.btn-fill-quaternary .login-btn-loader-text {
    color: var(--login-okd-button-fill-quaternary-default-font-color)
}

.login-btn.btn-fill-quaternary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-quaternary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-quaternary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-quaternary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-quaternary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-quaternary-border-size)*2)
}

.login-btn.btn-fill-quaternary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red {
    background: var(--login-okd-button-fill-red-default-background);
    border-color: var(--login-okd-button-fill-red-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-red-border-size);
    box-shadow: var(--login-okd-button-fill-red-default-shadow);
    color: var(--login-okd-button-fill-red-default-font-color)
}

.login-btn.btn-fill-red.hover,.login-btn.btn-fill-red:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-red-hover-background);
    border-color: var(--login-okd-button-fill-red-hover-border-color);
    box-shadow: var(--login-okd-button-fill-red-hover-shadow);
    color: var(--login-okd-button-fill-red-hover-font-color)
}

.login-btn.btn-fill-red.hover .btn-icon,.login-btn.btn-fill-red:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-red-hover-icon-color)
}

.login-btn.btn-fill-red.active,.login-btn.btn-fill-red:not(:disabled):active {
    background: var(--login-okd-button-fill-red-active-background);
    border-color: var(--login-okd-button-fill-red-active-border-color);
    box-shadow: var(--login-okd-button-fill-red-active-shadow);
    color: var(--login-okd-button-fill-red-active-font-color);
    transition: none
}

.login-btn.btn-fill-red.active .btn-icon,.login-btn.btn-fill-red:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-red-active-icon-color)
}

.login-btn.btn-fill-red:not(.loading).btn-disabled,.login-btn.btn-fill-red:not(.loading):disabled {
    background: var(--login-okd-button-fill-red-disabled-background);
    border-color: var(--login-okd-button-fill-red-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-red-disabled-shadow);
    color: var(--login-okd-button-fill-red-disabled-font-color)
}

.login-btn.btn-fill-red:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-red:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-red-disabled-icon-color)
}

.login-btn.btn-fill-red.loading {
    cursor: pointer
}

.login-btn.btn-fill-red .btn-icon {
    color: var(--login-okd-button-fill-red-default-icon-color)
}

.login-btn.btn-fill-red .login-btn-loader-text {
    color: var(--login-okd-button-fill-red-default-font-color)
}

.login-btn.btn-fill-red.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-red.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-red.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-red.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-red.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-red.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-red.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-red.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-red-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-red.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-red-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-red-border-size)*2)
}

.login-btn.btn-fill-red.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green {
    background: var(--login-okd-button-fill-green-default-background);
    border-color: var(--login-okd-button-fill-green-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-green-border-size);
    box-shadow: var(--login-okd-button-fill-green-default-shadow);
    color: var(--login-okd-button-fill-green-default-font-color)
}

.login-btn.btn-fill-green.hover,.login-btn.btn-fill-green:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-green-hover-background);
    border-color: var(--login-okd-button-fill-green-hover-border-color);
    box-shadow: var(--login-okd-button-fill-green-hover-shadow);
    color: var(--login-okd-button-fill-green-hover-font-color)
}

.login-btn.btn-fill-green.hover .btn-icon,.login-btn.btn-fill-green:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-green-hover-icon-color)
}

.login-btn.btn-fill-green.active,.login-btn.btn-fill-green:not(:disabled):active {
    background: var(--login-okd-button-fill-green-active-background);
    border-color: var(--login-okd-button-fill-green-active-border-color);
    box-shadow: var(--login-okd-button-fill-green-active-shadow);
    color: var(--login-okd-button-fill-green-active-font-color);
    transition: none
}

.login-btn.btn-fill-green.active .btn-icon,.login-btn.btn-fill-green:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-green-active-icon-color)
}

.login-btn.btn-fill-green:not(.loading).btn-disabled,.login-btn.btn-fill-green:not(.loading):disabled {
    background: var(--login-okd-button-fill-green-disabled-background);
    border-color: var(--login-okd-button-fill-green-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-green-disabled-shadow);
    color: var(--login-okd-button-fill-green-disabled-font-color)
}

.login-btn.btn-fill-green:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-green:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-green-disabled-icon-color)
}

.login-btn.btn-fill-green.loading {
    cursor: pointer
}

.login-btn.btn-fill-green .btn-icon {
    color: var(--login-okd-button-fill-green-default-icon-color)
}

.login-btn.btn-fill-green .login-btn-loader-text {
    color: var(--login-okd-button-fill-green-default-font-color)
}

.login-btn.btn-fill-green.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-green.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-green.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-green.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-green.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-green.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-green.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-green.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-green-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-green.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-green-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-green-border-size)*2)
}

.login-btn.btn-fill-green.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey {
    background: var(--login-okd-button-fill-grey-default-background);
    border-color: var(--login-okd-button-fill-grey-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-fill-grey-border-size);
    box-shadow: var(--login-okd-button-fill-grey-default-shadow);
    color: var(--login-okd-button-fill-grey-default-font-color)
}

.login-btn.btn-fill-grey.hover,.login-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-fill-grey-hover-background);
    border-color: var(--login-okd-button-fill-grey-hover-border-color);
    box-shadow: var(--login-okd-button-fill-grey-hover-shadow);
    color: var(--login-okd-button-fill-grey-hover-font-color)
}

.login-btn.btn-fill-grey.hover .btn-icon,.login-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-fill-grey-hover-icon-color)
}

.login-btn.btn-fill-grey.active,.login-btn.btn-fill-grey:not(:disabled):active {
    background: var(--login-okd-button-fill-grey-active-background);
    border-color: var(--login-okd-button-fill-grey-active-border-color);
    box-shadow: var(--login-okd-button-fill-grey-active-shadow);
    color: var(--login-okd-button-fill-grey-active-font-color);
    transition: none
}

.login-btn.btn-fill-grey.active .btn-icon,.login-btn.btn-fill-grey:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-fill-grey-active-icon-color)
}

.login-btn.btn-fill-grey:not(.loading).btn-disabled,.login-btn.btn-fill-grey:not(.loading):disabled {
    background: var(--login-okd-button-fill-grey-disabled-background);
    border-color: var(--login-okd-button-fill-grey-disabled-border-color);
    box-shadow: var(--login-okd-button-fill-grey-disabled-shadow);
    color: var(--login-okd-button-fill-grey-disabled-font-color)
}

.login-btn.btn-fill-grey:not(.loading).btn-disabled .btn-icon,.login-btn.btn-fill-grey:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-fill-grey-disabled-icon-color)
}

.login-btn.btn-fill-grey.loading {
    cursor: pointer
}

.login-btn.btn-fill-grey .btn-icon {
    color: var(--login-okd-button-fill-grey-default-icon-color)
}

.login-btn.btn-fill-grey .login-btn-loader-text {
    color: var(--login-okd-button-fill-grey-default-font-color)
}

.login-btn.btn-fill-grey.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-fill-grey.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-fill-grey-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-fill-grey.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-grey-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-fill-grey-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-fill-grey-border-size)*2)
}

.login-btn.btn-fill-grey.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight {
    background: var(--login-okd-button-outline-highlight-default-background);
    border-color: var(--login-okd-button-outline-highlight-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-outline-highlight-border-size);
    box-shadow: var(--login-okd-button-outline-highlight-default-shadow);
    color: var(--login-okd-button-outline-highlight-default-font-color)
}

.login-btn.btn-outline-highlight.hover,.login-btn.btn-outline-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-outline-highlight-hover-background);
    border-color: var(--login-okd-button-outline-highlight-hover-border-color);
    box-shadow: var(--login-okd-button-outline-highlight-hover-shadow);
    color: var(--login-okd-button-outline-highlight-hover-font-color)
}

.login-btn.btn-outline-highlight.hover .btn-icon,.login-btn.btn-outline-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-outline-highlight-hover-icon-color)
}

.login-btn.btn-outline-highlight.active,.login-btn.btn-outline-highlight:not(:disabled):active {
    background: var(--login-okd-button-outline-highlight-active-background);
    border-color: var(--login-okd-button-outline-highlight-active-border-color);
    box-shadow: var(--login-okd-button-outline-highlight-active-shadow);
    color: var(--login-okd-button-outline-highlight-active-font-color);
    transition: none
}

.login-btn.btn-outline-highlight.active .btn-icon,.login-btn.btn-outline-highlight:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-outline-highlight-active-icon-color)
}

.login-btn.btn-outline-highlight:not(.loading).btn-disabled,.login-btn.btn-outline-highlight:not(.loading):disabled {
    background: var(--login-okd-button-outline-highlight-disabled-background);
    border-color: var(--login-okd-button-outline-highlight-disabled-border-color);
    box-shadow: var(--login-okd-button-outline-highlight-disabled-shadow);
    color: var(--login-okd-button-outline-highlight-disabled-font-color)
}

.login-btn.btn-outline-highlight:not(.loading).btn-disabled .btn-icon,.login-btn.btn-outline-highlight:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-outline-highlight-disabled-icon-color)
}

.login-btn.btn-outline-highlight.loading {
    cursor: pointer
}

.login-btn.btn-outline-highlight .btn-icon {
    color: var(--login-okd-button-outline-highlight-default-icon-color)
}

.login-btn.btn-outline-highlight .login-btn-loader-text {
    color: var(--login-okd-button-outline-highlight-default-font-color)
}

.login-btn.btn-outline-highlight.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-highlight.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-outline-highlight-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-outline-highlight.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-highlight-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-highlight-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-highlight-border-size)*2)
}

.login-btn.btn-outline-highlight.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary {
    background: var(--login-okd-button-outline-primary-default-background);
    border-color: var(--login-okd-button-outline-primary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-outline-primary-border-size);
    box-shadow: var(--login-okd-button-outline-primary-default-shadow);
    color: var(--login-okd-button-outline-primary-default-font-color)
}

.login-btn.btn-outline-primary.hover,.login-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-outline-primary-hover-background);
    border-color: var(--login-okd-button-outline-primary-hover-border-color);
    box-shadow: var(--login-okd-button-outline-primary-hover-shadow);
    color: var(--login-okd-button-outline-primary-hover-font-color)
}

.login-btn.btn-outline-primary.hover .btn-icon,.login-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-outline-primary-hover-icon-color)
}

.login-btn.btn-outline-primary.active,.login-btn.btn-outline-primary:not(:disabled):active {
    background: var(--login-okd-button-outline-primary-active-background);
    border-color: var(--login-okd-button-outline-primary-active-border-color);
    box-shadow: var(--login-okd-button-outline-primary-active-shadow);
    color: var(--login-okd-button-outline-primary-active-font-color);
    transition: none
}

.login-btn.btn-outline-primary.active .btn-icon,.login-btn.btn-outline-primary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-outline-primary-active-icon-color)
}

.login-btn.btn-outline-primary:not(.loading).btn-disabled,.login-btn.btn-outline-primary:not(.loading):disabled {
    background: var(--login-okd-button-outline-primary-disabled-background);
    border-color: var(--login-okd-button-outline-primary-disabled-border-color);
    box-shadow: var(--login-okd-button-outline-primary-disabled-shadow);
    color: var(--login-okd-button-outline-primary-disabled-font-color)
}

.login-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-outline-primary-disabled-icon-color)
}

.login-btn.btn-outline-primary.loading {
    cursor: pointer
}

.login-btn.btn-outline-primary .btn-icon {
    color: var(--login-okd-button-outline-primary-default-icon-color)
}

.login-btn.btn-outline-primary .login-btn-loader-text {
    color: var(--login-okd-button-outline-primary-default-font-color)
}

.login-btn.btn-outline-primary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-primary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-outline-primary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-outline-primary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-primary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-primary-border-size)*2)
}

.login-btn.btn-outline-primary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary {
    background: var(--login-okd-button-outline-secondary-default-background);
    border-color: var(--login-okd-button-outline-secondary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-outline-secondary-border-size);
    box-shadow: var(--login-okd-button-outline-secondary-default-shadow);
    color: var(--login-okd-button-outline-secondary-default-font-color)
}

.login-btn.btn-outline-secondary.hover,.login-btn.btn-outline-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-outline-secondary-hover-background);
    border-color: var(--login-okd-button-outline-secondary-hover-border-color);
    box-shadow: var(--login-okd-button-outline-secondary-hover-shadow);
    color: var(--login-okd-button-outline-secondary-hover-font-color)
}

.login-btn.btn-outline-secondary.hover .btn-icon,.login-btn.btn-outline-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-outline-secondary-hover-icon-color)
}

.login-btn.btn-outline-secondary.active,.login-btn.btn-outline-secondary:not(:disabled):active {
    background: var(--login-okd-button-outline-secondary-active-background);
    border-color: var(--login-okd-button-outline-secondary-active-border-color);
    box-shadow: var(--login-okd-button-outline-secondary-active-shadow);
    color: var(--login-okd-button-outline-secondary-active-font-color);
    transition: none
}

.login-btn.btn-outline-secondary.active .btn-icon,.login-btn.btn-outline-secondary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-outline-secondary-active-icon-color)
}

.login-btn.btn-outline-secondary:not(.loading).btn-disabled,.login-btn.btn-outline-secondary:not(.loading):disabled {
    background: var(--login-okd-button-outline-secondary-disabled-background);
    border-color: var(--login-okd-button-outline-secondary-disabled-border-color);
    box-shadow: var(--login-okd-button-outline-secondary-disabled-shadow);
    color: var(--login-okd-button-outline-secondary-disabled-font-color)
}

.login-btn.btn-outline-secondary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-outline-secondary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-outline-secondary-disabled-icon-color)
}

.login-btn.btn-outline-secondary.loading {
    cursor: pointer
}

.login-btn.btn-outline-secondary .btn-icon {
    color: var(--login-okd-button-outline-secondary-default-icon-color)
}

.login-btn.btn-outline-secondary .login-btn-loader-text {
    color: var(--login-okd-button-outline-secondary-default-font-color)
}

.login-btn.btn-outline-secondary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-secondary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-outline-secondary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-outline-secondary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-secondary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-secondary-border-size)*2)
}

.login-btn.btn-outline-secondary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary {
    background: var(--login-okd-button-outline-tertiary-default-background);
    border-color: var(--login-okd-button-outline-tertiary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-outline-tertiary-border-size);
    box-shadow: var(--login-okd-button-outline-tertiary-default-shadow);
    color: var(--login-okd-button-outline-tertiary-default-font-color)
}

.login-btn.btn-outline-tertiary.hover,.login-btn.btn-outline-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-outline-tertiary-hover-background);
    border-color: var(--login-okd-button-outline-tertiary-hover-border-color);
    box-shadow: var(--login-okd-button-outline-tertiary-hover-shadow);
    color: var(--login-okd-button-outline-tertiary-hover-font-color)
}

.login-btn.btn-outline-tertiary.hover .btn-icon,.login-btn.btn-outline-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-outline-tertiary-hover-icon-color)
}

.login-btn.btn-outline-tertiary.active,.login-btn.btn-outline-tertiary:not(:disabled):active {
    background: var(--login-okd-button-outline-tertiary-active-background);
    border-color: var(--login-okd-button-outline-tertiary-active-border-color);
    box-shadow: var(--login-okd-button-outline-tertiary-active-shadow);
    color: var(--login-okd-button-outline-tertiary-active-font-color);
    transition: none
}

.login-btn.btn-outline-tertiary.active .btn-icon,.login-btn.btn-outline-tertiary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-outline-tertiary-active-icon-color)
}

.login-btn.btn-outline-tertiary:not(.loading).btn-disabled,.login-btn.btn-outline-tertiary:not(.loading):disabled {
    background: var(--login-okd-button-outline-tertiary-disabled-background);
    border-color: var(--login-okd-button-outline-tertiary-disabled-border-color);
    box-shadow: var(--login-okd-button-outline-tertiary-disabled-shadow);
    color: var(--login-okd-button-outline-tertiary-disabled-font-color)
}

.login-btn.btn-outline-tertiary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-outline-tertiary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-outline-tertiary-disabled-icon-color)
}

.login-btn.btn-outline-tertiary.loading {
    cursor: pointer
}

.login-btn.btn-outline-tertiary .btn-icon {
    color: var(--login-okd-button-outline-tertiary-default-icon-color)
}

.login-btn.btn-outline-tertiary .login-btn-loader-text {
    color: var(--login-okd-button-outline-tertiary-default-font-color)
}

.login-btn.btn-outline-tertiary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-outline-tertiary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-outline-tertiary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-outline-tertiary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-outline-tertiary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-outline-tertiary-border-size)*2)
}

.login-btn.btn-outline-tertiary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary {
    background: var(--login-okd-button-text-primary-default-background);
    border-color: var(--login-okd-button-text-primary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-text-primary-border-size);
    box-shadow: var(--login-okd-button-text-primary-default-shadow);
    color: var(--login-okd-button-text-primary-default-font-color)
}

.login-btn.btn-text-primary.hover,.login-btn.btn-text-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-text-primary-hover-background);
    border-color: var(--login-okd-button-text-primary-hover-border-color);
    box-shadow: var(--login-okd-button-text-primary-hover-shadow);
    color: var(--login-okd-button-text-primary-hover-font-color)
}

.login-btn.btn-text-primary.hover .btn-icon,.login-btn.btn-text-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-text-primary-hover-icon-color)
}

.login-btn.btn-text-primary.active,.login-btn.btn-text-primary:not(:disabled):active {
    background: var(--login-okd-button-text-primary-active-background);
    border-color: var(--login-okd-button-text-primary-active-border-color);
    box-shadow: var(--login-okd-button-text-primary-active-shadow);
    color: var(--login-okd-button-text-primary-active-font-color);
    transition: none
}

.login-btn.btn-text-primary.active .btn-icon,.login-btn.btn-text-primary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-text-primary-active-icon-color)
}

.login-btn.btn-text-primary:not(.loading).btn-disabled,.login-btn.btn-text-primary:not(.loading):disabled {
    background: var(--login-okd-button-text-primary-disabled-background);
    border-color: var(--login-okd-button-text-primary-disabled-border-color);
    box-shadow: var(--login-okd-button-text-primary-disabled-shadow);
    color: var(--login-okd-button-text-primary-disabled-font-color)
}

.login-btn.btn-text-primary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-text-primary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-text-primary-disabled-icon-color)
}

.login-btn.btn-text-primary.loading {
    cursor: pointer
}

.login-btn.btn-text-primary .btn-icon {
    color: var(--login-okd-button-text-primary-default-icon-color)
}

.login-btn.btn-text-primary .login-btn-loader-text {
    color: var(--login-okd-button-text-primary-default-font-color)
}

.login-btn.btn-text-primary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-text-primary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-text-primary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-text-primary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-text-primary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-text-primary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-text-primary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-primary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-text-primary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-text-primary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-primary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-primary-border-size)*2)
}

.login-btn.btn-text-primary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary {
    background: var(--login-okd-button-text-secondary-default-background);
    border-color: var(--login-okd-button-text-secondary-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-text-secondary-border-size);
    box-shadow: var(--login-okd-button-text-secondary-default-shadow);
    color: var(--login-okd-button-text-secondary-default-font-color)
}

.login-btn.btn-text-secondary.hover,.login-btn.btn-text-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-text-secondary-hover-background);
    border-color: var(--login-okd-button-text-secondary-hover-border-color);
    box-shadow: var(--login-okd-button-text-secondary-hover-shadow);
    color: var(--login-okd-button-text-secondary-hover-font-color)
}

.login-btn.btn-text-secondary.hover .btn-icon,.login-btn.btn-text-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-text-secondary-hover-icon-color)
}

.login-btn.btn-text-secondary.active,.login-btn.btn-text-secondary:not(:disabled):active {
    background: var(--login-okd-button-text-secondary-active-background);
    border-color: var(--login-okd-button-text-secondary-active-border-color);
    box-shadow: var(--login-okd-button-text-secondary-active-shadow);
    color: var(--login-okd-button-text-secondary-active-font-color);
    transition: none
}

.login-btn.btn-text-secondary.active .btn-icon,.login-btn.btn-text-secondary:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-text-secondary-active-icon-color)
}

.login-btn.btn-text-secondary:not(.loading).btn-disabled,.login-btn.btn-text-secondary:not(.loading):disabled {
    background: var(--login-okd-button-text-secondary-disabled-background);
    border-color: var(--login-okd-button-text-secondary-disabled-border-color);
    box-shadow: var(--login-okd-button-text-secondary-disabled-shadow);
    color: var(--login-okd-button-text-secondary-disabled-font-color)
}

.login-btn.btn-text-secondary:not(.loading).btn-disabled .btn-icon,.login-btn.btn-text-secondary:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-text-secondary-disabled-icon-color)
}

.login-btn.btn-text-secondary.loading {
    cursor: pointer
}

.login-btn.btn-text-secondary .btn-icon {
    color: var(--login-okd-button-text-secondary-default-icon-color)
}

.login-btn.btn-text-secondary .login-btn-loader-text {
    color: var(--login-okd-button-text-secondary-default-font-color)
}

.login-btn.btn-text-secondary.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-secondary.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-text-secondary-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-text-secondary.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-secondary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-secondary-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-secondary-border-size)*2)
}

.login-btn.btn-text-secondary.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red {
    background: var(--login-okd-button-text-red-default-background);
    border-color: var(--login-okd-button-text-red-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-text-red-border-size);
    box-shadow: var(--login-okd-button-text-red-default-shadow);
    color: var(--login-okd-button-text-red-default-font-color)
}

.login-btn.btn-text-red.hover,.login-btn.btn-text-red:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-text-red-hover-background);
    border-color: var(--login-okd-button-text-red-hover-border-color);
    box-shadow: var(--login-okd-button-text-red-hover-shadow);
    color: var(--login-okd-button-text-red-hover-font-color)
}

.login-btn.btn-text-red.hover .btn-icon,.login-btn.btn-text-red:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-text-red-hover-icon-color)
}

.login-btn.btn-text-red.active,.login-btn.btn-text-red:not(:disabled):active {
    background: var(--login-okd-button-text-red-active-background);
    border-color: var(--login-okd-button-text-red-active-border-color);
    box-shadow: var(--login-okd-button-text-red-active-shadow);
    color: var(--login-okd-button-text-red-active-font-color);
    transition: none
}

.login-btn.btn-text-red.active .btn-icon,.login-btn.btn-text-red:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-text-red-active-icon-color)
}

.login-btn.btn-text-red:not(.loading).btn-disabled,.login-btn.btn-text-red:not(.loading):disabled {
    background: var(--login-okd-button-text-red-disabled-background);
    border-color: var(--login-okd-button-text-red-disabled-border-color);
    box-shadow: var(--login-okd-button-text-red-disabled-shadow);
    color: var(--login-okd-button-text-red-disabled-font-color)
}

.login-btn.btn-text-red:not(.loading).btn-disabled .btn-icon,.login-btn.btn-text-red:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-text-red-disabled-icon-color)
}

.login-btn.btn-text-red.loading {
    cursor: pointer
}

.login-btn.btn-text-red .btn-icon {
    color: var(--login-okd-button-text-red-default-icon-color)
}

.login-btn.btn-text-red .login-btn-loader-text {
    color: var(--login-okd-button-text-red-default-font-color)
}

.login-btn.btn-text-red.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-text-red.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-text-red.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-text-red.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-text-red.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-text-red.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-text-red.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-red.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-text-red-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-text-red.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-red-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-red-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-red-border-size)*2)
}

.login-btn.btn-text-red.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green {
    background: var(--login-okd-button-text-green-default-background);
    border-color: var(--login-okd-button-text-green-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-text-green-border-size);
    box-shadow: var(--login-okd-button-text-green-default-shadow);
    color: var(--login-okd-button-text-green-default-font-color)
}

.login-btn.btn-text-green.hover,.login-btn.btn-text-green:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-text-green-hover-background);
    border-color: var(--login-okd-button-text-green-hover-border-color);
    box-shadow: var(--login-okd-button-text-green-hover-shadow);
    color: var(--login-okd-button-text-green-hover-font-color)
}

.login-btn.btn-text-green.hover .btn-icon,.login-btn.btn-text-green:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-text-green-hover-icon-color)
}

.login-btn.btn-text-green.active,.login-btn.btn-text-green:not(:disabled):active {
    background: var(--login-okd-button-text-green-active-background);
    border-color: var(--login-okd-button-text-green-active-border-color);
    box-shadow: var(--login-okd-button-text-green-active-shadow);
    color: var(--login-okd-button-text-green-active-font-color);
    transition: none
}

.login-btn.btn-text-green.active .btn-icon,.login-btn.btn-text-green:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-text-green-active-icon-color)
}

.login-btn.btn-text-green:not(.loading).btn-disabled,.login-btn.btn-text-green:not(.loading):disabled {
    background: var(--login-okd-button-text-green-disabled-background);
    border-color: var(--login-okd-button-text-green-disabled-border-color);
    box-shadow: var(--login-okd-button-text-green-disabled-shadow);
    color: var(--login-okd-button-text-green-disabled-font-color)
}

.login-btn.btn-text-green:not(.loading).btn-disabled .btn-icon,.login-btn.btn-text-green:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-text-green-disabled-icon-color)
}

.login-btn.btn-text-green.loading {
    cursor: pointer
}

.login-btn.btn-text-green .btn-icon {
    color: var(--login-okd-button-text-green-default-icon-color)
}

.login-btn.btn-text-green .login-btn-loader-text {
    color: var(--login-okd-button-text-green-default-font-color)
}

.login-btn.btn-text-green.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-text-green.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-text-green.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-text-green.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-text-green.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-text-green.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-text-green.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-green.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-text-green-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-text-green.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-green-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-green-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-green-border-size)*2)
}

.login-btn.btn-text-green.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange {
    background: var(--login-okd-button-text-orange-default-background);
    border-color: var(--login-okd-button-text-orange-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-text-orange-border-size);
    box-shadow: var(--login-okd-button-text-orange-default-shadow);
    color: var(--login-okd-button-text-orange-default-font-color)
}

.login-btn.btn-text-orange.hover,.login-btn.btn-text-orange:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-text-orange-hover-background);
    border-color: var(--login-okd-button-text-orange-hover-border-color);
    box-shadow: var(--login-okd-button-text-orange-hover-shadow);
    color: var(--login-okd-button-text-orange-hover-font-color)
}

.login-btn.btn-text-orange.hover .btn-icon,.login-btn.btn-text-orange:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-text-orange-hover-icon-color)
}

.login-btn.btn-text-orange.active,.login-btn.btn-text-orange:not(:disabled):active {
    background: var(--login-okd-button-text-orange-active-background);
    border-color: var(--login-okd-button-text-orange-active-border-color);
    box-shadow: var(--login-okd-button-text-orange-active-shadow);
    color: var(--login-okd-button-text-orange-active-font-color);
    transition: none
}

.login-btn.btn-text-orange.active .btn-icon,.login-btn.btn-text-orange:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-text-orange-active-icon-color)
}

.login-btn.btn-text-orange:not(.loading).btn-disabled,.login-btn.btn-text-orange:not(.loading):disabled {
    background: var(--login-okd-button-text-orange-disabled-background);
    border-color: var(--login-okd-button-text-orange-disabled-border-color);
    box-shadow: var(--login-okd-button-text-orange-disabled-shadow);
    color: var(--login-okd-button-text-orange-disabled-font-color)
}

.login-btn.btn-text-orange:not(.loading).btn-disabled .btn-icon,.login-btn.btn-text-orange:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-text-orange-disabled-icon-color)
}

.login-btn.btn-text-orange.loading {
    cursor: pointer
}

.login-btn.btn-text-orange .btn-icon {
    color: var(--login-okd-button-text-orange-default-icon-color)
}

.login-btn.btn-text-orange .login-btn-loader-text {
    color: var(--login-okd-button-text-orange-default-font-color)
}

.login-btn.btn-text-orange.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-text-orange.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-text-orange.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-text-orange.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-text-orange.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-text-orange.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-text-orange.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-orange.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-text-orange-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-text-orange.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-orange-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-orange-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-orange-border-size)*2)
}

.login-btn.btn-text-orange.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow {
    background: var(--login-okd-button-text-yellow-default-background);
    border-color: var(--login-okd-button-text-yellow-default-border-color);
    border-style: solid;
    border-width: var(--login-okd-button-text-yellow-border-size);
    box-shadow: var(--login-okd-button-text-yellow-default-shadow);
    color: var(--login-okd-button-text-yellow-default-font-color)
}

.login-btn.btn-text-yellow.hover,.login-btn.btn-text-yellow:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--login-okd-button-text-yellow-hover-background);
    border-color: var(--login-okd-button-text-yellow-hover-border-color);
    box-shadow: var(--login-okd-button-text-yellow-hover-shadow);
    color: var(--login-okd-button-text-yellow-hover-font-color)
}

.login-btn.btn-text-yellow.hover .btn-icon,.login-btn.btn-text-yellow:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--login-okd-button-text-yellow-hover-icon-color)
}

.login-btn.btn-text-yellow.active,.login-btn.btn-text-yellow:not(:disabled):active {
    background: var(--login-okd-button-text-yellow-active-background);
    border-color: var(--login-okd-button-text-yellow-active-border-color);
    box-shadow: var(--login-okd-button-text-yellow-active-shadow);
    color: var(--login-okd-button-text-yellow-active-font-color);
    transition: none
}

.login-btn.btn-text-yellow.active .btn-icon,.login-btn.btn-text-yellow:not(:disabled):active .btn-icon {
    color: var(--login-okd-button-text-yellow-active-icon-color)
}

.login-btn.btn-text-yellow:not(.loading).btn-disabled,.login-btn.btn-text-yellow:not(.loading):disabled {
    background: var(--login-okd-button-text-yellow-disabled-background);
    border-color: var(--login-okd-button-text-yellow-disabled-border-color);
    box-shadow: var(--login-okd-button-text-yellow-disabled-shadow);
    color: var(--login-okd-button-text-yellow-disabled-font-color)
}

.login-btn.btn-text-yellow:not(.loading).btn-disabled .btn-icon,.login-btn.btn-text-yellow:not(.loading):disabled .btn-icon {
    color: var(--login-okd-button-text-yellow-disabled-icon-color)
}

.login-btn.btn-text-yellow.loading {
    cursor: pointer
}

.login-btn.btn-text-yellow .btn-icon {
    color: var(--login-okd-button-text-yellow-default-icon-color)
}

.login-btn.btn-text-yellow .login-btn-loader-text {
    color: var(--login-okd-button-text-yellow-default-font-color)
}

.login-btn.btn-text-yellow.btn-xxs {
    padding: calc(var(--login-okd-button-xxs-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-xxs-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-xxs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xxs-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-xxs-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-xxs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow.btn-xs {
    padding: calc(var(--login-okd-button-xs-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-xs-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-xs.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xs-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-xs-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-xs.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow.btn-s {
    padding: calc(var(--login-okd-button-s-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-s-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-s.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-s-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-s-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-s.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow.btn-sm {
    padding: calc(var(--login-okd-button-sm-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-sm-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-sm.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-sm-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-sm-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-sm.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow.btn-md {
    padding: calc(var(--login-okd-button-md-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-md-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-md.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-md-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-md-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-md.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow.btn-lg {
    padding: calc(var(--login-okd-button-lg-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-lg-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-lg.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-lg-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-lg-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-lg.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-text-yellow.btn-xl {
    padding: calc(var(--login-okd-button-xl-padding-vertical) + 1px - var(--login-okd-button-text-yellow-border-size)) var(--login-okd-button-xl-padding-horizontal)
}

.login-btn.btn-text-yellow.btn-xl.login-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-yellow-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--login-okd-button-xl-padding-vertical)*2 + 2px - var(--login-okd-button-text-yellow-border-size)*2 + var(--login-okd-button-xl-line-height) + var(--login-okd-button-text-yellow-border-size)*2)
}

.login-btn.btn-text-yellow.btn-xl.login-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.btn-xxs {
    border-radius: var(--login-okd-button-xxs-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-xxs-font-weight,500);
    min-width: var(--login-okd-button-xxs-min-width)
}

.login-btn.btn-xxs,.login-btn.btn-xxs .login-btn-loader-text {
    font-size: var(--login-okd-button-xxs-font-size);
    line-height: var(--login-okd-button-xxs-line-height)
}

.login-btn.btn-xxs .login-btn-loader-text {
    margin-left: var(--login-okd-button-xxs-loader-text-margin-left)
}

.login-btn.btn-xxs.btn-rect {
    border-radius: 4px;
    border-radius: var(--login-okd-button-rect-xxs-border-radius,4px)
}

.login-btn.btn-xs {
    border-radius: var(--login-okd-button-xs-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-xs-font-weight,500);
    min-width: var(--login-okd-button-xs-min-width)
}

.login-btn.btn-xs,.login-btn.btn-xs .login-btn-loader-text {
    font-size: var(--login-okd-button-xs-font-size);
    line-height: var(--login-okd-button-xs-line-height)
}

.login-btn.btn-xs .login-btn-loader-text {
    margin-left: var(--login-okd-button-xs-loader-text-margin-left)
}

.login-btn.btn-xs.btn-rect {
    border-radius: 4px;
    border-radius: var(--login-okd-button-rect-xs-border-radius,4px)
}

.login-btn.btn-s {
    border-radius: var(--login-okd-button-s-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-s-font-weight,500);
    min-width: var(--login-okd-button-s-min-width)
}

.login-btn.btn-s,.login-btn.btn-s .login-btn-loader-text {
    font-size: var(--login-okd-button-s-font-size);
    line-height: var(--login-okd-button-s-line-height)
}

.login-btn.btn-s .login-btn-loader-text {
    margin-left: var(--login-okd-button-s-loader-text-margin-left)
}

.login-btn.btn-s.btn-rect {
    border-radius: 4px;
    border-radius: var(--login-okd-button-rect-s-border-radius,4px)
}

.login-btn.btn-sm {
    border-radius: var(--login-okd-button-sm-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-sm-font-weight,500);
    min-width: var(--login-okd-button-sm-min-width)
}

.login-btn.btn-sm,.login-btn.btn-sm .login-btn-loader-text {
    font-size: var(--login-okd-button-sm-font-size);
    line-height: var(--login-okd-button-sm-line-height)
}

.login-btn.btn-sm .login-btn-loader-text {
    margin-left: var(--login-okd-button-sm-loader-text-margin-left)
}

.login-btn.btn-sm.btn-rect {
    border-radius: 4px;
    border-radius: var(--login-okd-button-rect-sm-border-radius,4px)
}

.login-btn.btn-md {
    border-radius: var(--login-okd-button-md-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-md-font-weight,500);
    min-width: var(--login-okd-button-md-min-width)
}

.login-btn.btn-md,.login-btn.btn-md .login-btn-loader-text {
    font-size: var(--login-okd-button-md-font-size);
    line-height: var(--login-okd-button-md-line-height)
}

.login-btn.btn-md .login-btn-loader-text {
    margin-left: var(--login-okd-button-md-loader-text-margin-left)
}

.login-btn.btn-md.btn-rect {
    border-radius: 4px;
    border-radius: var(--login-okd-button-rect-md-border-radius,4px)
}

.login-btn.btn-lg {
    border-radius: var(--login-okd-button-lg-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-lg-font-weight,500);
    min-width: var(--login-okd-button-lg-min-width)
}

.login-btn.btn-lg,.login-btn.btn-lg .login-btn-loader-text {
    font-size: var(--login-okd-button-lg-font-size);
    line-height: var(--login-okd-button-lg-line-height)
}

.login-btn.btn-lg .login-btn-loader-text {
    margin-left: var(--login-okd-button-lg-loader-text-margin-left)
}

.login-btn.btn-lg.btn-rect {
    border-radius: 8px;
    border-radius: var(--login-okd-button-rect-lg-border-radius,8px)
}

.login-btn.btn-xl {
    border-radius: var(--login-okd-button-xl-border-radius);
    font-weight: 500;
    font-weight: var(--login-okd-button-xl-font-weight,500);
    min-width: var(--login-okd-button-xl-min-width)
}

.login-btn.btn-xl,.login-btn.btn-xl .login-btn-loader-text {
    font-size: var(--login-okd-button-xl-font-size);
    line-height: var(--login-okd-button-xl-line-height)
}

.login-btn.btn-xl .login-btn-loader-text {
    margin-left: var(--login-okd-button-xl-loader-text-margin-left)
}

.login-btn.btn-xl.btn-rect {
    border-radius: 8px;
    border-radius: var(--login-okd-button-rect-xl-border-radius,8px)
}

.login-btn.btn-disabled,.login-btn:disabled {
    cursor: not-allowed
}

.login-btn.block {
    display: flex;
    width: 100%
}

.login-btn.btn-circle {
    border-radius: 100px!important
}

.login-btn .btn-content {
    align-items: center;
    display: flex
}

.login-btn .login-btn-ellipsis {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.login-btn.loading .btn-content {
    opacity: 0
}

.login-btn.loading .btn-content-position {
    display: none
}

.login-btn.loading .login-btn-loader {
    line-height: 0;
    position: absolute
}

.login-btn.loading .btn-loader-position-absolute {
    position: relative
}

.login-btn-loader-container {
    height: 100%;
    position: relative
}

.login-btn .btn-icon+.btn-content {
    margin-left: 4px
}

.login-btn.btn-xxs .btn-icon {
    font-size: var(--login-okd-button-xxs-icon-size)
}

.login-btn.btn-xxs .btn-icon-leading {
    margin-right: var(--login-okd-button-xxs-icon-margin)
}

.login-btn.btn-xxs .btn-icon-tailing {
    margin-left: var(--login-okd-button-xxs-icon-margin)
}

.login-btn.btn-xxs .login-btn-loader-size {
    border-radius: var(--login-okd-button-xxs-loader-size);
    height: var(--login-okd-button-xxs-loader-size);
    width: var(--login-okd-button-xxs-loader-size)
}

.login-btn.btn-xs .btn-icon {
    font-size: var(--login-okd-button-xs-icon-size)
}

.login-btn.btn-xs .btn-icon-leading {
    margin-right: var(--login-okd-button-xs-icon-margin)
}

.login-btn.btn-xs .btn-icon-tailing {
    margin-left: var(--login-okd-button-xs-icon-margin)
}

.login-btn.btn-xs .login-btn-loader-size {
    border-radius: var(--login-okd-button-xs-loader-size);
    height: var(--login-okd-button-xs-loader-size);
    width: var(--login-okd-button-xs-loader-size)
}

.login-btn.btn-s .btn-icon {
    font-size: var(--login-okd-button-s-icon-size)
}

.login-btn.btn-s .btn-icon-leading {
    margin-right: var(--login-okd-button-s-icon-margin)
}

.login-btn.btn-s .btn-icon-tailing {
    margin-left: var(--login-okd-button-s-icon-margin)
}

.login-btn.btn-s .login-btn-loader-size {
    border-radius: var(--login-okd-button-s-loader-size);
    height: var(--login-okd-button-s-loader-size);
    width: var(--login-okd-button-s-loader-size)
}

.login-btn.btn-sm .btn-icon {
    font-size: var(--login-okd-button-sm-icon-size)
}

.login-btn.btn-sm .btn-icon-leading {
    margin-right: var(--login-okd-button-sm-icon-margin)
}

.login-btn.btn-sm .btn-icon-tailing {
    margin-left: var(--login-okd-button-sm-icon-margin)
}

.login-btn.btn-sm .login-btn-loader-size {
    border-radius: var(--login-okd-button-sm-loader-size);
    height: var(--login-okd-button-sm-loader-size);
    width: var(--login-okd-button-sm-loader-size)
}

.login-btn.btn-md .btn-icon {
    font-size: var(--login-okd-button-md-icon-size)
}

.login-btn.btn-md .btn-icon-leading {
    margin-right: var(--login-okd-button-md-icon-margin)
}

.login-btn.btn-md .btn-icon-tailing {
    margin-left: var(--login-okd-button-md-icon-margin)
}

.login-btn.btn-md .login-btn-loader-size {
    border-radius: var(--login-okd-button-md-loader-size);
    height: var(--login-okd-button-md-loader-size);
    width: var(--login-okd-button-md-loader-size)
}

.login-btn.btn-lg .btn-icon {
    font-size: var(--login-okd-button-lg-icon-size)
}

.login-btn.btn-lg .btn-icon-leading {
    margin-right: var(--login-okd-button-lg-icon-margin)
}

.login-btn.btn-lg .btn-icon-tailing {
    margin-left: var(--login-okd-button-lg-icon-margin)
}

.login-btn.btn-lg .login-btn-loader-size {
    border-radius: var(--login-okd-button-lg-loader-size);
    height: var(--login-okd-button-lg-loader-size);
    width: var(--login-okd-button-lg-loader-size)
}

.login-btn.btn-xl .btn-icon {
    font-size: var(--login-okd-button-xl-icon-size)
}

.login-btn.btn-xl .btn-icon-leading {
    margin-right: var(--login-okd-button-xl-icon-margin)
}

.login-btn.btn-xl .btn-icon-tailing {
    margin-left: var(--login-okd-button-xl-icon-margin)
}

.login-btn.btn-xl .login-btn-loader-size {
    border-radius: var(--login-okd-button-xl-loader-size);
    height: var(--login-okd-button-xl-loader-size);
    width: var(--login-okd-button-xl-loader-size)
}

.login-btn .login-btn-fill-highlight-loader {
    border-color: var(--login-okd-button-fill-highlight-loader-track-color);
    border-top-color: var(--login-okd-button-fill-highlight-loader-mark-color)
}

.login-btn .login-btn-fill-primary-loader {
    border-color: var(--login-okd-button-fill-primary-loader-track-color);
    border-top-color: var(--login-okd-button-fill-primary-loader-mark-color)
}

.login-btn .login-btn-fill-secondary-loader {
    border-color: var(--login-okd-button-fill-secondary-loader-track-color);
    border-top-color: var(--login-okd-button-fill-secondary-loader-mark-color)
}

.login-btn .login-btn-fill-tertiary-loader {
    border-color: var(--login-okd-button-fill-tertiary-loader-track-color);
    border-top-color: var(--login-okd-button-fill-tertiary-loader-mark-color)
}

.login-btn .login-btn-fill-quaternary-loader {
    border-color: var(--login-okd-button-fill-quaternary-loader-track-color);
    border-top-color: var(--login-okd-button-fill-quaternary-loader-mark-color)
}

.login-btn .login-btn-fill-red-loader {
    border-color: var(--login-okd-button-fill-red-loader-track-color);
    border-top-color: var(--login-okd-button-fill-red-loader-mark-color)
}

.login-btn .login-btn-fill-green-loader {
    border-color: var(--login-okd-button-fill-green-loader-track-color);
    border-top-color: var(--login-okd-button-fill-green-loader-mark-color)
}

.login-btn .login-btn-fill-grey-loader {
    border-color: var(--login-okd-button-fill-grey-loader-track-color);
    border-top-color: var(--login-okd-button-fill-grey-loader-mark-color)
}

.login-btn .login-btn-outline-highlight-loader {
    border-color: var(--login-okd-button-outline-highlight-loader-track-color);
    border-top-color: var(--login-okd-button-outline-highlight-loader-mark-color)
}

.login-btn .login-btn-outline-primary-loader {
    border-color: var(--login-okd-button-outline-primary-loader-track-color);
    border-top-color: var(--login-okd-button-outline-primary-loader-mark-color)
}

.login-btn .login-btn-outline-secondary-loader {
    border-color: var(--login-okd-button-outline-secondary-loader-track-color);
    border-top-color: var(--login-okd-button-outline-secondary-loader-mark-color)
}

.login-btn .login-btn-outline-tertiary-loader {
    border-color: var(--login-okd-button-outline-tertiary-loader-track-color);
    border-top-color: var(--login-okd-button-outline-tertiary-loader-mark-color)
}
.theme-light,:root {
    --login-okd-notification-success-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-notification-info-icon-color: var(--login-okd-color-content-primary);
    --login-okd-notification-warn-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-notification-error-icon-color: var(--login-okd-color-semantic-negative);
    --login-okd-notification-title-color: var(--login-okd-color-content-primary);
    --login-okd-notification-text-color: var(--login-okd-color-content-secondary);
    --login-okd-notification-action-confirm-btn-color: var(--login-okd-color-content-primary);
    --login-okd-notification-action-cancel-btn-color: var(--login-okd-color-content-primary);
    --login-okd-notification-box-close-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-notification-box-shadow: var(--login-okd-shadow-xl);
    --login-okd-notification-box-background: var(--login-okd-color-modal-tertiary);
    --login-okd-notification-box-border-color: var(--login-okd-color-border-primary);
    --login-okd-notification-box-border-radius: var(--login-okd-border-radius-md);
    --login-okd-notification-box-padding: 16px;
    --login-okd-notification-box-each-margin: 14px;
    --login-okd-notification-box-max-width: 700px;
    --login-okd-notification-box-min-width: 451px;
    --login-okd-notification-box-auto-width-min-width: 100px;
    --login-okd-notification-box-icon-text-margin: 15px;
    --login-okd-notification-title-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-title-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-text-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-text-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-action-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-action-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-pending-icon-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-default-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-default-underline-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-hover-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-primary-hover-icon-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-primary-hover-underline-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-secondary-default-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-secondary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-secondary-default-underline-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-secondary-hover-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-secondary-hover-icon-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-secondary-hover-underline-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-xs-font-size: 12px;
    --login-okd-hyperlink-sm-font-size: 14px;
    --login-okd-hyperlink-md-font-size: 16px;
    --login-okd-hyperlink-lg-font-size: 18px;
    --login-okd-hyperlink-xs-icon-font-size: 12px;
    --login-okd-hyperlink-sm-icon-font-size: 16px;
    --login-okd-hyperlink-md-icon-font-size: 16px;
    --login-okd-hyperlink-lg-icon-font-size: 16px;
    --login-okd-hyperlink-xs-line-height: 16px;
    --login-okd-hyperlink-sm-line-height: 16px;
    --login-okd-hyperlink-md-line-height: 20px;
    --login-okd-hyperlink-lg-line-height: 24px;
    --login-okd-hyperlink-medium-font-weight: 500;
    --login-okd-hyperlink-medium-hover-font-weight: 500;
    --login-okd-hyperlink-muted-font-weight: 400;
    --login-okd-hyperlink-muted-hover-font-weight: 400;
    --login-okd-hyperlink-amplified-font-weight: 700;
    --login-okd-hyperlink-amplified-hover-font-weight: 700;
    --login-okd-hyperlink-xs-icon-margin-left: 0px;
    --login-okd-hyperlink-sm-icon-margin-left: 0px;
    --login-okd-hyperlink-md-icon-margin-left: 0px;
    --login-okd-hyperlink-lg-icon-margin-left: 0px;
    --login-okd-hyperlink-reversed-default-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-default-underline-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-hover-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-hover-underline-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-accent-default-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-default-icon-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-default-underline-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-hover-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-hover-icon-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-hover-underline-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-reversed-disabled-color: var(--login-okd-color-content-disabled);
    --login-okd-hyperlink-accent-disabled-color: var(--login-okd-color-content-disabled);
    --login-okd-hyperlink-primary-disabled-color: var(--login-okd-color-content-disabled);
    --login-okd-color-link-accent-surface-pressed: #d2e8a4;
    --login-okd-color-link-accent-content-disabled: #d2e8a4
}

.theme-dark {
    --login-okd-notification-success-icon-color: var(--login-okd-color-semantic-positive);
    --login-okd-notification-info-icon-color: var(--login-okd-color-content-primary);
    --login-okd-notification-warn-icon-color: var(--login-okd-color-semantic-notice);
    --login-okd-notification-error-icon-color: var(--login-okd-color-semantic-negative);
    --login-okd-notification-title-color: var(--login-okd-color-content-primary);
    --login-okd-notification-text-color: var(--login-okd-color-content-secondary);
    --login-okd-notification-action-confirm-btn-color: var(--login-okd-color-content-primary);
    --login-okd-notification-action-cancel-btn-color: var(--login-okd-color-content-primary);
    --login-okd-notification-box-close-icon-color: var(--login-okd-color-content-contrast);
    --login-okd-notification-box-shadow: var(--login-okd-shadow-xl);
    --login-okd-notification-box-background: var(--login-okd-color-modal-tertiary);
    --login-okd-notification-box-border-color: var(--login-okd-color-border-secondary);
    --login-okd-notification-box-border-radius: var(--login-okd-border-radius-md);
    --login-okd-notification-box-padding: 16px;
    --login-okd-notification-box-each-margin: 14px;
    --login-okd-notification-box-max-width: 700px;
    --login-okd-notification-box-min-width: 451px;
    --login-okd-notification-box-auto-width-min-width: 100px;
    --login-okd-notification-box-icon-text-margin: 15px;
    --login-okd-notification-title-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-title-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-text-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-text-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-action-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-action-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-pending-icon-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-default-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-default-underline-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-primary-hover-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-primary-hover-icon-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-primary-hover-underline-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-secondary-default-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-secondary-default-icon-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-secondary-default-underline-color: var(--login-okd-color-content-primary);
    --login-okd-hyperlink-secondary-hover-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-secondary-hover-icon-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-secondary-hover-underline-color: var(--login-okd-color-content-secondary);
    --login-okd-hyperlink-xs-font-size: 12px;
    --login-okd-hyperlink-sm-font-size: 14px;
    --login-okd-hyperlink-md-font-size: 16px;
    --login-okd-hyperlink-lg-font-size: 18px;
    --login-okd-hyperlink-xs-icon-font-size: 12px;
    --login-okd-hyperlink-sm-icon-font-size: 16px;
    --login-okd-hyperlink-md-icon-font-size: 16px;
    --login-okd-hyperlink-lg-icon-font-size: 16px;
    --login-okd-hyperlink-xs-line-height: 16px;
    --login-okd-hyperlink-sm-line-height: 16px;
    --login-okd-hyperlink-md-line-height: 20px;
    --login-okd-hyperlink-lg-line-height: 24px;
    --login-okd-hyperlink-medium-font-weight: 500;
    --login-okd-hyperlink-medium-hover-font-weight: 500;
    --login-okd-hyperlink-muted-font-weight: 400;
    --login-okd-hyperlink-muted-hover-font-weight: 400;
    --login-okd-hyperlink-amplified-font-weight: 700;
    --login-okd-hyperlink-amplified-hover-font-weight: 700;
    --login-okd-hyperlink-xs-icon-margin-left: 0px;
    --login-okd-hyperlink-sm-icon-margin-left: 0px;
    --login-okd-hyperlink-md-icon-margin-left: 0px;
    --login-okd-hyperlink-lg-icon-margin-left: 0px;
    --login-okd-hyperlink-reversed-default-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-default-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-default-underline-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-hover-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-hover-icon-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-reversed-hover-underline-color: var(--login-okd-color-content-inverse);
    --login-okd-hyperlink-accent-default-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-default-icon-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-default-underline-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-hover-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-hover-icon-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-hyperlink-accent-hover-underline-color: var(--login-okd-color-link-accent-content-primary);
    --login-okd-color-link-accent-surface-pressed: #1a410e;
    --login-okd-color-link-accent-content-disabled: #3d5c00
}

.theme-okcoin {
    --login-okd-notification-success-icon-color: var(--login-okd-color-green-500);
    --login-okd-notification-info-icon-color: var(--login-okd-color-blue-500);
    --login-okd-notification-warn-icon-color: var(--login-okd-color-yellow-500);
    --login-okd-notification-error-icon-color: var(--login-okd-color-red-500);
    --login-okd-notification-title-color: var(--login-okd-color-purple-1000);
    --login-okd-notification-text-color: var(--login-okd-color-gray-600);
    --login-okd-notification-action-confirm-btn-color: var(--login-okd-color-purple-1000);
    --login-okd-notification-action-cancel-btn-color: var(--login-okd-color-gray-600);
    --login-okd-notification-box-close-icon-color: var(--login-okd-color-gray-800);
    --login-okd-notification-box-shadow: var(--login-okd-shadow-xl);
    --login-okd-notification-box-background: var(--login-okd-color-background-1);
    --login-okd-notification-box-border-color: var(--login-okd-color-gray-100);
    --login-okd-notification-box-border-radius: var(--login-okd-border-radius-md);
    --login-okd-notification-box-padding: 16px;
    --login-okd-notification-box-each-margin: 14px;
    --login-okd-notification-box-max-width: 700px;
    --login-okd-notification-box-min-width: 451px;
    --login-okd-notification-box-auto-width-min-width: 100px;
    --login-okd-notification-box-icon-text-margin: 15px;
    --login-okd-notification-title-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-title-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-text-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-text-line-height: var(--login-okd-line-height-md);
    --login-okd-notification-action-font-size: var(--login-okd-font-size-md);
    --login-okd-notification-action-line-height: var(--login-okd-line-height-md);
    --login-okd-hyperlink-primary-default-color: var(--login-okd-color-purple-1000);
    --login-okd-hyperlink-primary-default-icon-color: var(--login-okd-color-purple-1000);
    --login-okd-hyperlink-primary-default-underline-color: var(--login-okd-color-purple-1000);
    --login-okd-hyperlink-primary-hover-color: var(--login-okd-color-purple-700);
    --login-okd-hyperlink-primary-hover-icon-color: var(--login-okd-color-purple-700);
    --login-okd-hyperlink-primary-hover-underline-color: var(--login-okd-color-purple-700);
    --login-okd-hyperlink-secondary-default-color: var(--login-okd-color-gray-600);
    --login-okd-hyperlink-secondary-default-icon-color: var(--login-okd-color-gray-600);
    --login-okd-hyperlink-secondary-default-underline-color: var(--login-okd-color-gray-600);
    --login-okd-hyperlink-secondary-hover-color: var(--login-okd-color-gray-600);
    --login-okd-hyperlink-secondary-hover-icon-color: var(--login-okd-color-gray-600);
    --login-okd-hyperlink-secondary-hover-underline-color: var(--login-okd-color-gray-600);
    --login-okd-hyperlink-xs-font-size: 12px;
    --login-okd-hyperlink-sm-font-size: 14px;
    --login-okd-hyperlink-md-font-size: 16px;
    --login-okd-hyperlink-lg-font-size: 18px;
    --login-okd-hyperlink-xs-icon-font-size: 12px;
    --login-okd-hyperlink-sm-icon-font-size: 16px;
    --login-okd-hyperlink-md-icon-font-size: 16px;
    --login-okd-hyperlink-lg-icon-font-size: 16px;
    --login-okd-hyperlink-xs-line-height: 18px;
    --login-okd-hyperlink-sm-line-height: 21px;
    --login-okd-hyperlink-md-line-height: 26px;
    --login-okd-hyperlink-lg-line-height: 27px;
    --login-okd-hyperlink-medium-font-weight: 700;
    --login-okd-hyperlink-medium-hover-font-weight: 700;
    --login-okd-hyperlink-muted-font-weight: 700;
    --login-okd-hyperlink-muted-hover-font-weight: 700;
    --login-okd-hyperlink-amplified-font-weight: 700;
    --login-okd-hyperlink-amplified-hover-font-weight: 700;
    --login-okd-hyperlink-xs-icon-margin-left: 10px;
    --login-okd-hyperlink-sm-icon-margin-left: 10px;
    --login-okd-hyperlink-md-icon-margin-left: 10px;
    --login-okd-hyperlink-lg-icon-margin-left: 10px
}

.login-notification-default {
    height: 100vh;
    position: fixed;
    width: 100vw
}

.login-notification-default,.login-notification-wrap {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    left: 0;
    line-height: 1;
    margin: 0;
    padding: 0;
    pointer-events: none;
    top: 0
}

.login-notification-wrap {
    height: 100%;
    position: absolute;
    width: 100%
}

.login-notification * {
    box-sizing: border-box
}

.login-notification-container.container-remove {
    animation-duration: .55s;
    animation-name: NotificationOutTop
}

.login-notification-box {
    animation-duration: .3s;
    background: var(--login-okd-notification-box-background);
    border: thin solid var(--login-okd-notification-box-border-color);
    border-radius: var(--login-okd-notification-box-border-radius);
    box-shadow: var(--login-okd-notification-box-shadow);
    display: inline-flex;
    line-height: 1;
    margin: calc(var(--login-okd-notification-box-each-margin)/2) 0;
    max-width: var(--login-okd-notification-box-max-width);
    min-width: var(--login-okd-notification-box-min-width);
    overflow: hidden;
    padding: var(--login-okd-notification-box-padding);
    pointer-events: all;
    position: relative
}

.login-notification-box.auto-width {
    min-width: var(--login-okd-notification-box-auto-width-min-width)
}

.login-notification-box .login-notification-icon-circle-container {
    display: inline-block;
    height: 20px;
    margin-right: var(--login-okd-notification-box-icon-text-margin);
    vertical-align: top;
    width: 20px
}

.login-notification-box .login-notification-icon-new {
    font-size: 20px;
    height: 100%;
    width: 100%
}

.login-notification-box .login-notification-content {
    display: inline-flex;
    flex: 1 1;
    flex-direction: column;
    flex-wrap: wrap;
    word-break: break-word
}

.login-notification-box .login-notification-inline {
    flex-direction: unset
}

.login-notification-box .login-notification-inline .login-notification-action {
    margin-top: 0;
    width: auto
}

.login-notification-box .login-notification-title-box {
    display: inline-flex;
    flex: 1 1;
    flex-direction: column;
    flex-wrap: wrap
}

.login-notification-box .login-notification-title {
    color: var(--login-okd-notification-title-color);
    flex: 1 1;
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: var(--login-okd-notification-title-line-height);
    text-align: left
}

.login-notification-box .login-notification-desc,.login-notification-box .login-notification-text {
    color: var(--login-okd-notification-text-color);
    font-size: var(--login-okd-notification-text-font-size);
    line-height: var(--login-okd-notification-text-line-height)
}

.login-notification-box .login-notification-desc {
    margin-top: 4px;
    text-align: left;
    width: 100%
}

.login-notification-box .login-notification-action {
    display: inline-block;
    margin-top: 12px;
    pointer-events: auto;
    text-align: left;
    width: 100%
}

.login-notification-box .login-notification-action .action-undo {
    color: var(--login-okd-notification-action-confirm-btn-color)
}

.login-notification-box .login-notification-action .action-dismiss,.login-notification-box .login-notification-action .action-undo {
    cursor: pointer;
    font-size: var(--login-okd-notification-action-font-size);
    font-weight: 500;
    line-height: var(--login-okd-notification-action-line-height)
}

.login-notification-box .login-notification-action .action-dismiss {
    color: var(--login-okd-notification-action-cancel-btn-color)
}

.login-notification-box .login-notification-action .action-undo+.action-dismiss {
    margin-left: 16px
}

.login-notification-box .login-notification-close {
    -webkit-tap-highlight-color: transparent;
    color: var(--login-okd-notification-box-close-icon-color);
    cursor: pointer;
    font-size: 22px;
    height: 22px;
    margin-left: 15px;
    pointer-events: auto;
    position: relative;
    top: -2px;
    width: 22px
}

.login-notification-box.success .login-notification-icon-new {
    color: var(--login-okd-notification-success-icon-color)
}

.login-notification-box.info .login-notification-icon-new {
    color: var(--login-okd-notification-info-icon-color)
}

.login-notification-box.warn .login-notification-icon-new {
    color: var(--login-okd-notification-warn-icon-color)
}

.login-notification-box.error .login-notification-icon-new {
    color: var(--login-okd-notification-error-icon-color)
}

.login-notification-box.pending .login-notification-icon-new {
    color: var(--login-okd-notification-pending-icon-color)
}

.login-notification.login-notification-bottom,.login-notification.login-notification-bottom-left,.login-notification.login-notification-bottom-right {
    justify-content: flex-end
}

.login-notification.login-notification-bottom .container-remove,.login-notification.login-notification-bottom-left .container-remove,.login-notification.login-notification-bottom-right .container-remove {
    animation-name: NotificationOutBottom
}

.login-notification.login-notification-bottom-right .login-notification-container,.login-notification.login-notification-top-right .login-notification-container {
    text-align: right
}

.login-notification.login-notification-bottom .login-notification-container,.login-notification.login-notification-top .login-notification-container {
    text-align: center
}

.login-notification.login-notification-bottom-left .login-notification-box,.login-notification.login-notification-top-left .login-notification-box {
    animation-name: NotificationInLeft
}

.login-notification.login-notification-bottom-right .login-notification-box,.login-notification.login-notification-top-right .login-notification-box {
    animation-name: NotificationInRight
}

.login-notification.login-notification-top .login-notification-box {
    animation-name: NotificationInTop
}

.login-notification.login-notification-bottom .login-notification-box {
    animation-name: NotificationInBottom
}

@media (max-width: 767px) {
    .login-notification.login-notification-bottom-left .login-notification-container,.login-notification.login-notification-bottom-right .login-notification-container,.login-notification.login-notification-top-left .login-notification-container,.login-notification.login-notification-top-right .login-notification-container {
        text-align:center
    }

    .login-notification-box {
        min-width: unset;
        width: 100%
    }

    .login-notification-box.auto-width {
        width: auto
    }
}

@keyframes NotificationInLeft {
    0% {
        opacity: 0;
        transform: translate3d(-30px,0,0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes NotificationInRight {
    0% {
        opacity: 0;
        transform: translate3d(30px,0,0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes NotificationInTop {
    0% {
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes NotificationInBottom {
    0% {
        opacity: 0;
        transform: translate3d(0,30px,0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes NotificationOutBottom {
    0% {
        max-height: 150px;
        opacity: 1;
        transform: translateZ(0)
    }

    to {
        max-height: 0;
        opacity: 0;
        transform: translate3d(0,30px,0)
    }
}

@keyframes NotificationOutTop {
    0% {
        max-height: 150px;
        opacity: 1;
        transform: translateZ(0)
    }

    to {
        max-height: 0;
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }
}

.login-hyperlink-xs .login-hyperlink-text {
    font-size: var(--login-okd-hyperlink-xs-font-size);
    line-height: var(--login-okd-hyperlink-xs-line-height)
}

.login-hyperlink-xs .icon-arrow {
    font-size: var(--login-okd-hyperlink-xs-icon-font-size);
    margin-left: var(--login-okd-hyperlink-xs-icon-margin-left)
}

.login-hyperlink-sm .login-hyperlink-text {
    font-size: var(--login-okd-hyperlink-sm-font-size);
    line-height: var(--login-okd-hyperlink-sm-line-height)
}

.login-hyperlink-sm .icon-arrow {
    font-size: var(--login-okd-hyperlink-sm-icon-font-size);
    margin-left: var(--login-okd-hyperlink-sm-icon-margin-left)
}

.login-hyperlink-md .login-hyperlink-text {
    font-size: var(--login-okd-hyperlink-md-font-size);
    line-height: var(--login-okd-hyperlink-md-line-height)
}

.login-hyperlink-md .icon-arrow {
    font-size: var(--login-okd-hyperlink-md-icon-font-size);
    margin-left: var(--login-okd-hyperlink-md-icon-margin-left)
}

.login-hyperlink-lg .login-hyperlink-text {
    font-size: var(--login-okd-hyperlink-lg-font-size);
    line-height: var(--login-okd-hyperlink-lg-line-height)
}

.login-hyperlink-lg .icon-arrow {
    font-size: var(--login-okd-hyperlink-lg-icon-font-size);
    margin-left: var(--login-okd-hyperlink-lg-icon-margin-left)
}

.login-hyperlink-muted {
    font-weight: var(--login-okd-hyperlink-muted-font-weight)
}

.login-hyperlink-muted:hover {
    font-weight: var(--login-okd-hyperlink-muted-hover-font-weight)
}

.login-hyperlink-medium {
    font-weight: var(--login-okd-hyperlink-medium-font-weight)
}

.login-hyperlink-medium:hover {
    font-weight: var(--login-okd-hyperlink-medium-hover-font-weight)
}

.login-hyperlink-amplified {
    font-weight: var(--login-okd-hyperlink-amplified-font-weight)
}

.login-hyperlink-amplified:hover {
    font-weight: var(--login-okd-hyperlink-amplified-hover-font-weight)
}

.login-hyperlink-primary {
    color: var(--login-okd-hyperlink-primary-default-color)
}

.login-hyperlink-primary .icon-arrow {
    color: var(--login-okd-hyperlink-primary-default-icon-color)
}

.login-hyperlink-primary:hover {
    color: var(--login-okd-hyperlink-primary-hover-color)
}

.login-hyperlink-primary:hover .login-hyperlink-text {
    color: var(--login-okd-hyperlink-primary-hover-color);
    text-decoration: underline;
    text-underline-offset: 3px
}

.login-hyperlink-primary:hover .icon-arrow {
    color: var(--login-okd-hyperlink-primary-hover-icon-color)
}

.login-hyperlink-primary a,.login-hyperlink-primary a:active,.login-hyperlink-primary a:visited {
    color: var(--login-okd-hyperlink-primary-default-color)
}

.login-hyperlink-secondary {
    color: var(--login-okd-hyperlink-secondary-default-color)
}

.login-hyperlink-secondary .icon-arrow {
    color: var(--login-okd-hyperlink-secondary-default-icon-color)
}

.login-hyperlink-secondary:hover {
    color: var(--login-okd-hyperlink-secondary-hover-color)
}

.login-hyperlink-secondary:hover .login-hyperlink-text {
    color: var(--login-okd-hyperlink-secondary-hover-color);
    text-decoration: underline;
    text-underline-offset: 3px
}

.login-hyperlink-secondary:hover .icon-arrow {
    color: var(--login-okd-hyperlink-secondary-hover-icon-color)
}

.login-hyperlink-secondary a,.login-hyperlink-secondary a:active,.login-hyperlink-secondary a:visited {
    color: var(--login-okd-hyperlink-secondary-default-color)
}

.login-hyperlink-reversed {
    color: var(--login-okd-hyperlink-reversed-default-color)
}

.login-hyperlink-reversed .icon-arrow {
    color: var(--login-okd-hyperlink-reversed-default-icon-color)
}

.login-hyperlink-reversed:hover {
    color: var(--login-okd-hyperlink-reversed-hover-color)
}

.login-hyperlink-reversed:hover .login-hyperlink-text {
    color: var(--login-okd-hyperlink-reversed-hover-color);
    text-decoration: underline;
    text-underline-offset: 3px
}

.login-hyperlink-reversed:hover .icon-arrow {
    color: var(--login-okd-hyperlink-reversed-hover-icon-color)
}

.login-hyperlink-reversed a,.login-hyperlink-reversed a:active,.login-hyperlink-reversed a:visited {
    color: var(--login-okd-hyperlink-reversed-default-color)
}

.login-hyperlink-accent {
    color: var(--login-okd-hyperlink-accent-default-color)
}

.login-hyperlink-accent .icon-arrow {
    color: var(--login-okd-hyperlink-accent-default-icon-color)
}

.login-hyperlink-accent:hover {
    color: var(--login-okd-hyperlink-accent-hover-color)
}

.login-hyperlink-accent:hover .login-hyperlink-text {
    color: var(--login-okd-hyperlink-accent-hover-color);
    text-decoration: underline;
    text-underline-offset: 3px
}

.login-hyperlink-accent:hover .icon-arrow {
    color: var(--login-okd-hyperlink-accent-hover-icon-color)
}

.login-hyperlink-accent a,.login-hyperlink-accent a:active,.login-hyperlink-accent a:visited {
    color: var(--login-okd-hyperlink-accent-default-color)
}

.login-hyperlink-text {
    text-decoration: none
}

.login-hyperlink-underline .login-hyperlink-text {
    text-decoration: underline;
    text-underline-offset: 3px
}

.login-hyperlink-no-hover-underline:hover .login-hyperlink-text {
    text-decoration: none
}

.login-hyperlink {
    align-items: center;
    cursor: pointer;
    display: inline-flex
}

.login-hyperlink .icon-arrow {
    cursor: auto;
    font-weight: inherit
}

.login-hyperlink a:focus-visible {
    border-radius: 2px;
    outline: 2px solid var(--login-okd-color-border-focus);
    outline-color: var(--login-okd-color-border-focus);
    outline-offset: 2px;
    outline-style: solid;
    outline-width: 2px
}


.okds-fail-circle-fill {
    --ok-icon-font-family: "ok-b983c4766d"
}

.okds-fail-circle-fill:before {
    content: "\e02f";
    font-family: ok-b983c4766d
}