.home-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(-100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.home-page.show {
transform: translateX(0);
}
.home-page .body-wrapper{
width:100%;
padding:60px 0 0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}
.home-page .body-wrapper .main-platform{
width:min(500px , calc(100% - 40px));
background:var(--blue);
border-radius:10px;
padding:20px;
margin:20px 0 0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:10px;
}
.home-page .body-wrapper .main-platform .top-text-wrapper{
width:100%;
display:flex;
align-items: center;
justify-content:space-between;
}
.home-page .body-wrapper .main-platform .top-text-wrapper .total-value-text{
color:rgba(255,255,255,0.8);
font-size:14px;
font-family: sans-serif;
font-weight:550;
}
.home-page .body-wrapper .main-platform .top-text-wrapper .history-icon{
color:rgba(255,255,255,0.8);
font-size:15px;
background:transparent;
border:none;
margin:0;
padding: 0;
cursor:pointer;
}
.home-page .body-wrapper .main-platform .top-text-wrapper .history-icon:hover{
transform:scale(1.05);
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper{
width:100%;
display:flex;
align-items: center;
justify-content:flex-start;
gap:10px;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper{
display:flex;
align-items:center;
justify-content:flex-start;
gap:5px;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper .value-text{
font-size:25px;
color:rgba(255,255,255,0.9);
font-family:'Font Awesome 6 Free';
letter-spacing:0.4mm;
word-spacing: -3px;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper.show .value-text .show-text{
display:inline;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper.show .value-text .hide-text{
display:none;
}

.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper.hide{
align-items:center;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper.hide .value-text{
letter-spacing: 6px;
font-size: 12px;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper.hide .value-text .show-text{
display:none;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .value-wrapper.hide .value-text .hide-text{
display:inline;
}

.home-page .body-wrapper .main-platform .bottom-text-wrapper .toggle-value-visibility-button{
background:transparent;
border:none;
color:rgba(255,255,255,0.9);
font-size:15px;
cursor:pointer;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .toggle-value-visibility-button.hide .hide-icon{
display:inline;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .toggle-value-visibility-button.hide .show-icon{
display:none;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .toggle-value-visibility-button.show .hide-icon{
display:none;
}
.home-page .body-wrapper .main-platform .bottom-text-wrapper .toggle-value-visibility-button.show .show-icon{
display:inline;
}

.home-page .body-wrapper .connect-other-wallets-wrapper{
width:min(500px , calc(100% - 40px));
background:#f1f1f1;
border-radius:10px;
padding:20px;
margin:15px 0 0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.home-page .body-wrapper .connect-other-wallets-wrapper .image{
width:50px;
}
.home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper{
width:calc(100% - 50px);
display:flex;
align-items:flex-start;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:0;
padding:0 0 0 20px;
}
.home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .title{
font-family:system-ui,sans-serif;
font-size:15px;
line-height:20px;
color:#444;
font-weight:550;
text-align:left;
}
.home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .text{
font-family:system-ui,sans-serif;
font-size:14px;
line-height:19px;
color:#555;
font-weight:400;
margin:3px 0 0;
text-align:left;
}
.home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .button{
color:var(--blue);
font-family: sans-serif;
font-size:14px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
margin:5px 0 0;
transition:0.2s;
background:transparent;
border:none;
padding:0;
text-align:left;
}
.home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .button .icon{
font-size:11px;
}






.home-page .body-wrapper .unpaid-invoice-message-wrapper{
width:min(500px , calc(100% - 40px));
background: #fcf1dd;
border-radius: 10px;
padding: 20px;
margin: 15px 0 0;
display: none;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
position: relative;
overflow: hidden;
cursor: pointer;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper.show{
display: flex;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .invoice-icon{
width:50px;
height:100%;
display:flex;
align-items: center;
justify-content: center;
position:relative;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .invoice-icon .icon{
font-size:35px;
color:#444;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .invoice-icon .number-display{
color: rgba(255, 255, 255, 0.9);
font-size: 8px;
font-family: sans-serif;
font-weight: 400;
padding: 0;
height: 12px;
width: 20px;
background: #f55;
align-items: center;
justify-content: center;
text-align: center;
border-radius: 15px;
display: flex;
position: absolute;
top: -27px;
bottom: 0;
left: 0;
right: -25px;
margin: auto;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper{
width:calc(100% - 50px);
display:flex;
align-items:flex-start;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:0;
padding:0 0 0 20px;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .title{
font-family:system-ui,sans-serif;
font-size:15px;
line-height:20px;
color:#444;
font-weight:550;
text-align:left;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .text{
font-family:system-ui,sans-serif;
font-size:14px;
line-height:19px;
color:#555;
font-weight:400;
margin:3px 0 0;
text-align:left;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .button{
color:var(--blue);
font-family: sans-serif;
font-size:14px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
margin:5px 0 0;
transition:0.2s;
background:transparent;
border:none;
padding:0;
text-align:left;
}
.home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .button .icon{
font-size:11px;
}






.home-page .body-wrapper .bottom-content-wrapper {
    background: #f9f9f9;
    padding: 0 0 100px;
    border-radius:20px 20px 0 0;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:row;
    flex-wrap:wrap;
    gap:0;
    border-top: 1px solid #f1f1f1;
    box-shadow:0 -1px 5px 1px rgba(0,0,0,0.1);
    margin:20px 0 0;
}
.home-page .body-wrapper .bottom-content-wrapper .hr-line-icon-wrapper{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:15px 0 0;
}
.home-page .body-wrapper .bottom-content-wrapper .hr-line-icon-wrapper .hr-line-icon{
    width: 45px;
    height: 4px;
    border-radius: 20px;
    background: #666;
}
.home-page .body-wrapper .search-field-wrapper{
width:min(500px , calc(100% - 40px));
height:40px;
background:#f5f5f5;
border:1px solid #e5e5e5;
border-radius:30px;
display:flex;
align-items:center;
justify-content:flex-start;
color:#666;
font-family: sans-serif;
padding:0 20px;
font-weight:550;
margin:15px 0 0;
font-size: 14px;
}



.home-page .body-wrapper .sub-platform-1{
width:100%;
background:transparent;
margin:20px 0 0;
padding:0 20px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
}

.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper{
width:100%;
height:40px;
background:transparent;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:0;
padding:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .coin-logo{
width:40px;
height:40px;
border-radius:50%;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper{
width:calc(100% - 55px);
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:2px;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:15px;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .show-value{
display:flex;
align-items: center;
justify-content:flex-end;
flex-direction:row;
flex-wrap:nowrap;
gap:5px;
text-align: right;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .value{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .activate-button{
display:none;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .pending-button{
display:none;
}


.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.inactive .text-wrapper{
width:calc(100% - 55px - 90px);
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.inactive .activate-button{
width:75px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}



.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.pending .text-wrapper{
width:calc(100% - 55px - 100px);
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.pending .pending-button{
width:85px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}

.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.show-value .show-value{
display:inline;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.show-value .hide-value{
display:none;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.hide-value .show-value{
display:none !important;
}
.home-page .body-wrapper .sub-platform-1 .coin-content-wrapper.hide-value .hide-value{
display: flex;
align-items: center;
font-family: 'fontawesome';
letter-spacing: 3px;
font-size: 10px;
}






/* DARK MODE */
body.dark-theme .home-page .body-wrapper .connect-other-wallets-wrapper{
background: var(--light-black);
}
body.dark-theme .home-page .body-wrapper .connect-other-wallets-wrapper .image{
filter: brightness(0) contrast(1) invert(1);
}
body.dark-theme .home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .title{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .home-page .body-wrapper .connect-other-wallets-wrapper .text-wrapper .button{
color:dodgerblue;
}

body.dark-theme .home-page .body-wrapper .unpaid-invoice-message-wrapper{
background: #2f364f;
}
body.dark-theme .home-page .body-wrapper .unpaid-invoice-message-wrapper .invoice-icon .icon{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .title{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .home-page .body-wrapper .unpaid-invoice-message-wrapper .text-wrapper .button{
color:dodgerblue;
}

body.dark-theme .home-page .body-wrapper .bottom-content-wrapper{
background: var(--light-black);
border-top:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .home-page .body-wrapper .bottom-content-wrapper .hr-line-icon-wrapper .hr-line-icon{
background:rgba(255, 255, 255, 0.4);
}
body.dark-theme .home-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .home-page .body-wrapper .sub-platform-1 .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:rgba(255, 255, 255, 0.7);
}

@media screen and (min-width: 950px) {
    .home-page .body-wrapper{
        padding:60px 0 0;
    }
    .home-page .body-wrapper .main-platform{
        margin:20px calc(calc(100% - 500px) / 2) 0;
    }
    .home-page .body-wrapper .connect-other-wallets-wrapper{
        margin:20px calc(calc(100% - 500px) / 2) 0;
    }
    .home-page .body-wrapper .unpaid-invoice-message-wrapper.show{
        margin:20px calc(calc(100% - 500px) / 2) 0;
    }
    .home-page .body-wrapper .bottom-content-wrapper{
        border-radius:0;
    }
    .home-page .body-wrapper .search-field-wrapper{
        margin:20px 0 0;
        height: 45px;
        padding: 0 25px;
    }
    .home-page .body-wrapper .sub-platform-1{
        gap:15px;
        justify-content: flex-start;
    }
    .home-page .body-wrapper .sub-platform-1 .coin-content-wrapper{
        width: calc(50% - 7.5px);
        border: 1px solid #d1d1d1;
        background: #f5f5f5;
        border-radius: 5px;
        height: 60px;
        padding: 0 15px;
    }

    /* DARK MODE */
    body.dark-theme .home-page .body-wrapper .sub-platform-1 .coin-content-wrapper{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }

}
.all-coins-page {
position: fixed;
top: 0;
left:0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.all-coins-page.show{
transform: translateX(0);
}

.all-coins-page .body-wrapper{
width:100%;
padding:60px 0 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}
.all-coins-page .body-wrapper .search-field-wrapper {
width: calc(100% - 40px);
height: 50px;
border: 1px solid #e5e5e5;
background: #f5f5f5;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
overflow: hidden;
margin: 15px 0 0;
}
.all-coins-page .body-wrapper .search-field-wrapper .search-icon{
width:50px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
font-size:14px;
color:#444;
}
.all-coins-page .body-wrapper .search-field-wrapper .search-field{
width:calc(100% - 100px);
height:100%;
border:none;
background:transparent;
font-size:14px;
color:#444;
}
.all-coins-page .body-wrapper .search-field-wrapper .clear-button-wrapper{
width:50px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
}
.all-coins-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
width: 100%;
height: 100%;
border: none;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
color: var(--dark-blue);
position: relative;
overflow: hidden;
cursor: pointer;
padding: 0;
}




.all-coins-page .body-wrapper .all-coins-wrapper{
width:100%;
background:#fff;
margin:20px 0 0;
padding:0 20px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper{
width:100%;
height:40px;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:0;
padding:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .coin-logo{
width:40px;
height:40px;
border-radius:50%;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper{
width:calc(100% - 55px);
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:2px;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:15px;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .show-value{
display:flex;
align-items: center;
justify-content:flex-end;
flex-direction:row;
flex-wrap:nowrap;
gap:5px;
text-align: right;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .value{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .activate-button{
display:none;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .pending-button{
display:none;
}


.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.inactive .text-wrapper{
width:calc(100% - 55px - 90px);
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.inactive .activate-button{
width:75px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}



.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.pending .text-wrapper{
width:calc(100% - 55px - 100px);
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.pending .pending-button{
width:85px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}

.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.show-value .show-value{
display:inline;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.show-value .hide-value{
display:none;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.hide-value .show-value{
display:none !important;
}
.all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper.hide-value .hide-value{
display: flex;
align-items: center;
font-family: 'fontawesome';
letter-spacing: 3px;
font-size: 10px;
}

.all-coins-page .body-wrapper .all-coins-wrapper .not-found-text{
width:min(500px , calc(100% - 40px));
padding:30px 20px;
margin:auto;
background:#f5f5f5;
border:1px solid #d1d1d1;
font-family: sans-serif;
font-size:15px;
color:#555;
font-weight:550;
text-align: center;
border-radius:10px;
}



/* DARK MODE */
body.dark-theme .all-coins-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .all-coins-page .body-wrapper .search-field-wrapper .search-icon{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .all-coins-page .body-wrapper .search-field-wrapper .search-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .all-coins-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
color:var(--light-blue);
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper{
background:transparent;
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper{
background:transparent;
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


@media screen and (min-width: 950px) {
    .user-coin-detail-page .about-coin-page{
        padding:0 0 0 300px;
    }
    .all-coins-page .body-wrapper .all-coins-wrapper{
        gap:15px;
        justify-content: flex-start;
    }
    .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper{
        width: calc(50% - 7.5px);
        border: 1px solid #d1d1d1;
        background: #f5f5f5;
        border-radius: 5px;
        height: 60px;
        padding: 0 15px;
    }
    
    /* DARK MODE */
    body.dark-theme .all-coins-page .body-wrapper .all-coins-wrapper .coin-content-wrapper{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
}.user-coin-detail-page{
position: fixed;
top: 0;
left:0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
overflow-x: hidden;
scroll-behavior: smooth;
}
.user-coin-detail-page.show{
transform: translateX(0);
}

.user-coin-detail-page .body-wrapper{
width:100%;
padding:60px 0 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}
.user-coin-detail-page .body-wrapper .main-platform{
width:calc(100% - 40px);
background:#f8f8f8;
border-radius:10px;
padding:20px;
margin:20px 0 0;
border:1px solid #d1d1d1;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0px;
}
.user-coin-detail-page .body-wrapper .main-platform .title-wrapper{
display:flex;
align-items:center;
justify-content:center;
width:100%;
padding:0 0 20px;
margin:0 0 20px;
border-bottom:1px solid #d1d1d1;
}
.user-coin-detail-page .body-wrapper .main-platform .title-wrapper .title{
width:calc(100% - 20px);
padding:0 0 0 20px;
font-family:sans-serif;
font-size:17px;
font-weight:550;
color:#444;
text-align:center;
}
.user-coin-detail-page .body-wrapper .main-platform .title-wrapper .button{
width:20px;
padding:0;
display:flex;
justify-content: flex-end;
background:transparent;
color:#555;
font-size:16px;
border:none;
transition:0.2s;
cursor:pointer;
}
.user-coin-detail-page .body-wrapper .main-platform .title-wrapper .button:hover{
transform:scale(1.05);
}

.user-coin-detail-page .body-wrapper .main-platform .coin-logo{
width:50px;
height:50px;
border-radius:50%;
}
.user-coin-detail-page .body-wrapper .main-platform .text-wrapper{
width:calc(100% - 50px);
display:flex;
align-items:flex-start;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:5px;
padding:0 0 0 20px;
}
.user-coin-detail-page .body-wrapper .main-platform .text-wrapper .text{
font-family:sans-serif;
font-size:14px;
color:#444;
font-weight:400;
display:flex;
align-items: center;
justify-content:space-between;
width:100%;
}
.user-coin-detail-page .body-wrapper .main-platform .text-wrapper .text .left-text{
font-weight:550;
}



.user-coin-detail-page .body-wrapper .coin-balance-wrapper{
width:100%;
display:flex;
align-items: flex-start;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:4px;
background: transparent;
margin:20px 0 0;
padding:0 20px;
display:none;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper>.title{
font-size:14px;
color:#444;
font-family: sans-serif;
font-weight:550;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper{
width:100%;
padding:0;
border:1px solid #d1d1d1;
background:#f8f8f8;
border-radius:10px;
display:flex;
align-items: flex-start;
justify-content:space-between;
flex-direction: row;
flex-wrap:wrap;
gap:0;
position:relative;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper::before{
content:"";
height:calc(100% - 40px);
width:1px;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
background:#d1d1d1;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper{
width:50%;
height:100%;
padding:20px;
display:flex;
align-items: flex-start;
justify-content: flex-start;
flex-direction: column;
flex-wrap:wrap;
gap:0;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper .title{
color:#444;
font-size:14px;
font-family: sans-serif;
font-weight:400;
width: 100%;
text-align: center;
display:flex;
align-items: center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper:nth-of-type(2) .title .text{
width:calc(100% - 15px);
padding:0 0 0 15px;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper:nth-of-type(2) .title .info-button{
width:15px;
color:#666;
cursor:pointer;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper .dollar-balance{
font-size:18px;
color:#555;
font-weight: 550;
font-family: sans-serif;
margin:7px 0 0;
width: 100%;
text-align: center;
}
.user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper .coin-balance{
font-size:12px;
color:#555;
font-weight:400;
width: 100%;
text-align: center;
}


.user-coin-detail-page .body-wrapper .action-buttons-wrapper{
width: 100%;
margin:20px 0 0;
padding:0 20px;
background:#fff;
display: flex;
align-items: center;
justify-content:center;
flex-direction: row;
flex-wrap:wrap;
gap:0;
display:none;
}
.user-coin-detail-page .body-wrapper .action-buttons-wrapper .button {
padding:0;
width: 20%;
background: transparent;
border: none;
border-radius:0px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap:nowrap;
gap: 5px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.user-coin-detail-page .body-wrapper .action-buttons-wrapper .button>.icon {
color: rgba(255, 255, 255, 0.9);
font-size: 16px;
background:linear-gradient(45deg, var(--blue), var(--light-blue));
border:1px solid var(--blue);
border-radius:50%;
width:45px;
height:45px;
display:flex;
align-items: center;
justify-content: center;
}
.user-coin-detail-page .body-wrapper .action-buttons-wrapper .button>.text{
color:#444;
font-size:13px;
font-family:sans-serif;
width:100%;
text-align: center;
padding:0 5px;
}

.user-coin-detail-page .body-wrapper .activate-button-wrapper{
width: 100%;
margin:20px 0 0;
padding:0 20px;
background:#fff;
display: flex;
align-items: center;
justify-content:flex-start;
flex-direction: row;
flex-wrap:wrap;
gap:0;
display: none;
}
.user-coin-detail-page .body-wrapper .activate-button-wrapper .button{
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:14px;
padding:10px 20px;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
transition:0.2s;
display:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.user-coin-detail-page .body-wrapper .activate-button-wrapper .button.pending-button{
background: transparent;
color: #444;
font-weight: 550;
width: 100%;
font-size: 15px;
gap: 10px;
}

.user-coin-detail-page .body-wrapper .transaction-history-wrapper{
width: 100%;
margin:20px 0 0;
padding:20px;
background:#fff;
display: flex;
align-items: center;
justify-content:center;
flex-direction: row;
flex-wrap:wrap;
gap:0;
border-top: 1px solid #d1d1d1;
display:none;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper .heading{
width: 100%;
font-family:sans-serif;
font-size:16px;
color:#444;
font-weight:550;
}

.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data{
width: 100%;
margin:20px 0 0;
display: flex;
align-items: center;
justify-content:center;
flex-direction: row;
flex-wrap:wrap;
gap:25px;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .not-found-text{
width: min(500px, 100%);
border: 1px solid #d1d1d1;
background: #f8f8f8;
border-radius: 10px;
padding: 30px 20px;
color: #555;
font-family: sans-serif;
font-weight: 550;
font-size: 14px;
}

.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card{
width:100%;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
border:none;
padding:0;
margin:0;
position: relative;
overflow: hidden;
cursor: pointer;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .icon-wrapper{
width:40px;
height:40px;
border: 1px solid var(--blue);
border-radius:50%;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
color:var(--blue);
font-size:15px;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper{
width:calc(100% - 40px);
background: transparent;
display: flex;
align-items: center;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:5px;
padding:0 0 0 15px;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper{
width:100%;
background: transparent;
display: flex;
align-items:flex-start;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:0;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .title-text{
font-family:sans-serif;
font-size:15px;
font-weight:550;
color:#444;
text-align: left;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .date-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
color:#555;
text-align: right;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .value-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
color:#555;
word-break:break-word;
padding:0 10px 0 0;
text-align: left;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .status-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
border-radius:5px;
display: flex;
align-items: center;
justify-content:center;
gap:5px;
font-weight:550;
text-transform: capitalize;
}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .status-text.processed{color:var(--light-green)}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .status-text.pending{color:orange}
.user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .status-text.failed{color:#f44}


.user-coin-detail-page .body-wrapper.active .coin-balance-wrapper{display:flex;}
.user-coin-detail-page .body-wrapper.active .action-buttons-wrapper{display:flex}
.user-coin-detail-page .body-wrapper.active .activate-button-wrapper{display:none}
.user-coin-detail-page .body-wrapper.active .activate-button-wrapper .activate-button{display:none}
.user-coin-detail-page .body-wrapper.active .activate-button-wrapper .pending-button{display:none}
.user-coin-detail-page .body-wrapper.active .transaction-history-wrapper{display:flex}

.user-coin-detail-page .body-wrapper.inactive .coin-balance-wrapper{display:none;}
.user-coin-detail-page .body-wrapper.inactive .action-buttons-wrapper{display:none}
.user-coin-detail-page .body-wrapper.inactive .activate-button-wrapper{display:flex}
.user-coin-detail-page .body-wrapper.inactive .activate-button-wrapper .activate-button{display:flex}
.user-coin-detail-page .body-wrapper.inactive .activate-button-wrapper .pending-button{display:none}
.user-coin-detail-page .body-wrapper.inactive .transaction-history-wrapper{display:none}

.user-coin-detail-page .body-wrapper.pending .coin-balance-wrapper{display:none;}
.user-coin-detail-page .body-wrapper.pending .action-buttons-wrapper{display:none}
.user-coin-detail-page .body-wrapper.pending .activate-button-wrapper{display:flex}
.user-coin-detail-page .body-wrapper.pending .activate-button-wrapper .activate-button{display:none}
.user-coin-detail-page .body-wrapper.pending .activate-button-wrapper .pending-button{display:flex}
.user-coin-detail-page .body-wrapper.pending .transaction-history-wrapper{display:none}






.user-coin-detail-page .about-coin-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 1;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.user-coin-detail-page.show .about-coin-page.show{
transform: translateX(0);
}
.user-coin-detail-page .about-coin-page .content-wrapper {
width: min(500px, 100%);
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
padding: 80px 20px 100px;
margin:0 auto;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data{
width:100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .heading-text {
font-family: "fontawesome";
color:#444;
letter-spacing: 0.5mm;
font-size: 13px;
font-weight: 600;
width:100%;
text-align: center;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .coin-logo{
width:40px;
height:40px;
margin:15px 0 0;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .coin-price{
width: 100%;
font-family:'fontawesome';
font-size:18px;
color:#555;
font-weight:400;
letter-spacing:0.5mm;
text-align:center;
margin:15px 0 0;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .stats-title{
width: 100%;
font-family:sans-serif;
font-size:15px;
color:#444;
font-weight:550;
text-align: left;
margin:30px 0 0;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .stats-wrapper{
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
gap: 20px;
margin: 10px 0 0;
background: #f5f5f5;
border: 1px solid #e5e5e5;
border-radius: 10px;
padding: 25px 20px;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .stats-wrapper .text-wrapper{
font-family:sans-serif;
font-size:14px;
color:#555;
display:flex;
align-items: center;
justify-content:space-between;
width:100%;
}
.user-coin-detail-page .about-coin-page .content-wrapper #data .stats-wrapper .text-wrapper .left-text{
font-weight:550;
}
.user-coin-detail-page .about-coin-page .content-wrapper .close-button {
padding:15px 25px;
border: none;
font-family: "fontawesome";
font-size: 12px;
letter-spacing: 0.3mm;
transition: 0.1s;
background: none;
color:rgba(255,255,255,0.9);
background:#f44;
border-radius: 5px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
margin:20px 0 0;
position: relative;
overflow: hidden;
cursor: pointer;
}







/* DARK MODE */
body.dark-theme .user-coin-detail-page .body-wrapper .main-platform{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .user-coin-detail-page .body-wrapper .main-platform .title-wrapper{
border-bottom:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .user-coin-detail-page .body-wrapper .main-platform .title-wrapper .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .main-platform .title-wrapper .button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .main-platform .text-wrapper .text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .user-coin-detail-page .body-wrapper .coin-balance-wrapper>.title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper .dollar-balance{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper .coin-balance{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .user-coin-detail-page .body-wrapper .coin-balance-wrapper .content-wrapper .cell-wrapper:nth-of-type(2) .title .info-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .action-buttons-wrapper{
background: transparent;
}
body.dark-theme .user-coin-detail-page .body-wrapper .action-buttons-wrapper .button>.text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .user-coin-detail-page .body-wrapper .action-buttons-wrapper .button.pending-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .activate-button-wrapper{
background: transparent;
}
body.dark-theme .user-coin-detail-page .body-wrapper.pending .activate-button-wrapper .pending-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper{
background: transparent;
border-top:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .icon-wrapper{
border:1px solid dodgerblue;
color:dodgerblue;
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .title-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .date-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper #data .transaction-content-card .text-wrapper .inner-text-wrapper .value-text{
color:rgba(255, 255, 255, 0.8);
}


body.dark-theme .user-coin-detail-page .about-coin-page .content-wrapper #data .heading-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .about-coin-page .content-wrapper #data .coin-price{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .user-coin-detail-page .about-coin-page .content-wrapper #data .stats-title{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .user-coin-detail-page .about-coin-page .content-wrapper #data .stats-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .user-coin-detail-page .about-coin-page .content-wrapper #data .stats-wrapper .text-wrapper{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .user-coin-detail-page .about-coin-page .content-wrapper #data .stats-wrapper .text-wrapper .left-text{
color:rgba(255, 255, 255, 0.8);
}





@media screen and (min-width: 950px) {
    .user-coin-detail-page .about-coin-page{
        padding:0 0 0 300px;
    }
    .user-coin-detail-page .body-wrapper{
        width:600px;
        margin:auto;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
    }
    .user-coin-detail-page .body-wrapper .main-platform{
        width: 100%;
    }
    .user-coin-detail-page .body-wrapper .coin-balance-wrapper{
        padding:0;
    }
    .user-coin-detail-page .body-wrapper .transaction-history-wrapper{
        border: 1px solid #d1d1d1;
        border-radius: 10px;
        padding: 30px 20px;
        background: #f8f8f8;
    }

    /* DARK MODE */
    body.dark-theme .user-coin-detail-page .body-wrapper .transaction-history-wrapper{
        background: var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
    
}.notification-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.notification-page.show{
transform: translateX(0);
}

.notification-page .body-wrapper{
width:min(100% , 500px);
margin: auto;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}


.notification-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.notification-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.notification-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}


.notification-page .body-wrapper .content-container{
width:100%;
display:flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap:10px;
margin:20px 0 0;
}
.notification-page .body-wrapper .content-container .content-wrapper {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
background: #f9f9f9;
border: 1px solid #f1f1f1;
border-radius: 7px;
padding:20px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.notification-page .body-wrapper .content-container .content-wrapper .title{
font-family:system-ui,sans-serif;
font-size:15px;
line-height:20px;
color:#444;
font-weight:550;
width:100%;
text-align: left;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction: row;
flex-wrap:nowrap;
gap:10px;
}
.notification-page .body-wrapper .content-container .content-wrapper .title .notification-icon{
color:#555;
}
.notification-page .body-wrapper .content-container .content-wrapper .description{
font-family:system-ui,sans-serif;
font-size:14px;
line-height:19px;
color:#555;
font-weight:400;
margin:5px 0 0;
width:100%;
text-align: left;
}
.notification-page .body-wrapper .content-container .content-wrapper .date-and-view-more-wrapper{
width:100%;
display:flex;
align-items: center;
justify-content: space-between;
flex-direction: row;
flex-wrap: nowrap;
gap:10px;
margin:8px 0 0;
}
.notification-page .body-wrapper .content-container .content-wrapper .date-and-view-more-wrapper .date {
font-family: system-ui, sans-serif;
font-size: 10px;
line-height: 17px;
color: rgba(255, 255, 255, 0.9);
font-weight: 400;
text-align: left;
padding: 2px 8px;
border: none;
border-radius: 3px;
background: rgba(0, 0, 0, 0.5);
}
.notification-page .body-wrapper .content-container .content-wrapper .date-and-view-more-wrapper .view-more-text{
color:var(--blue);
font-family: sans-serif;
font-size:14px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
margin:5px 0 0;
transition:0.2s;
background:transparent;
border:none;
padding:0;
text-align:right;
}
.notification-page .body-wrapper .content-container .content-wrapper .date-and-view-more-wrapper .view-more-text .icon{
font-size:11px;
}

.notification-page .body-wrapper .content-container .not-found-text{
width: 100%;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
background: #f9f9f9;
border: 1px solid #e5e5e5;
border-radius: 7px;
padding:30px;
color:#666;
font-weight:600;
font-size: 17px;
font-family:'fontawesome';
letter-spacing:0.4mm;
}







/* DARK THEME */
body.dark-theme .notification-page .body-wrapper .heading .text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .notification-page .body-wrapper .heading .close-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .notification-page .body-wrapper .content-container .content-wrapper{
background: var(--light-black);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .notification-page .body-wrapper .content-container .content-wrapper .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .notification-page .body-wrapper .content-container .content-wrapper .notification-icon{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .notification-page .body-wrapper .content-container .content-wrapper .description{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .notification-page .body-wrapper .content-container .content-wrapper .date-and-view-more-wrapper .date{
background: rgba(255, 255, 255, 0.2);
}
body.dark-theme .notification-page .body-wrapper .content-container .content-wrapper .date-and-view-more-wrapper .view-more-text{
color:dodgerblue;
}



@media screen and (min-width: 950px) {
    .notification-page{
        padding:0 0 0 300px;
    }
}.link-external-wallet-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.link-external-wallet-page.show{
transform: translateX(0);
}

.link-external-wallet-page .body-wrapper{
width:min(100% , 500px);
margin: auto;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.link-external-wallet-page .body-wrapper .heading{
width:100%;
color: #444;
font-family: sans-serif;
font-weight:550;
font-size:20px;
margin:30px 0 0;
}
.link-external-wallet-page .body-wrapper .sub-heading-text{
width:100%;
color: #555;
font-family: sans-serif;
font-weight:400;
font-size:15px;
margin:10px 0 0;
}
.link-external-wallet-page .body-wrapper .content-wrapper{
width:100%;
border:1px solid #e5e5e5;
background: #f8f8f8;
border-radius:10px;
overflow: hidden;
padding:20px;
display:flex;
align-items:center;
justify-content:flex-start;
flex-direction: column;
flex-wrap:wrap;
gap:0;
margin:15px 0 0;
}
.link-external-wallet-page .body-wrapper .content-wrapper .title{
width:100%;
color: #555;
font-family: sans-serif;
font-weight:550;
font-size:15px;
}
.link-external-wallet-page .body-wrapper .content-wrapper .sub-text{
color:#555;
font-size:14px;
font-family: sans-serif;
font-weight:400;
width:100%;
margin:5px 0 0;
}
.link-external-wallet-page .body-wrapper .content-wrapper>.input-field{
width:100%;
height:45px;
border:1px solid #d1d1d1;
background: transparent;
text-indent: 15px;
color:#444;
font-size:14px;
font-family: sans-serif;
font-weight:400;
margin:10px 0 0;
border-radius:5px;
}
.link-external-wallet-page .body-wrapper .content-wrapper>.input-field.error{
border: 1px solid #f99 !important;
background: rgba(255, 0, 0, 0.05) !important;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data{
width:100%;
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction:row;
flex-wrap:wrap;
gap:5px;
margin: 10px 0 0;
border:1px solid #d1d1d1;
border-radius:5px;
padding:15px;
cursor:text;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data.error{
border: 1px solid #f99 !important;
background: rgba(255, 0, 0, 0.05) !important;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .phrase-wrapper{
max-width:100%;
display: flex;
align-items: center;
justify-content: center;
gap:5px;
padding:7px 10px;
border-radius:5px;
background:var(--blue);
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .phrase-wrapper .delete-button{
background:transparent;
color:rgba(255,255,255,0.9);
font-size:13px;
border:none;
font-weight:800;
padding:0;
cursor: pointer;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .phrase-wrapper .text{
color:rgba(255,255,255,0.9);
font-size:14px;
font-family: sans-serif;
font-weight:400;
width:100%;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .input-field-wrapper{
position: relative;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .input-field-wrapper .fake-text{
background:transparent;
min-width:100px;
max-width:100%;
min-height:17px;
font-size:14px;
font-family: sans-serif;
word-break:break-word;
padding:0;
opacity:0;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .input-field-wrapper .input-field{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
color:#444;
font-size:14px;
font-family: sans-serif;
font-weight:400;
border:none;
background:transparent;
padding:0;
resize: none;
overflow:hidden;
}
.link-external-wallet-page .body-wrapper .content-wrapper #data .input-field-wrapper .input-field:focus{
outline:none;
border:none;
}
.link-external-wallet-page .body-wrapper .content-wrapper .button-wrapper{
width:100%;
display: flex;
align-items: center;
justify-content: flex-end;
margin:15px 0 0;
}
.link-external-wallet-page .body-wrapper .content-wrapper .button-wrapper .connect-button{
height:50px;
padding:0 20px;
border-radius:5px;
border: none;
background:var(--green);
color:rgba(255,255,255,0.9);
font-weight:550;
font-size:14px;
font-family: sans-serif;
box-shadow:0 0 5px 1px rgba(0,0,0,0.2);
display: flex;
align-items: center;
justify-content:center;
gap:10px;
border: 1px solid #c1c1c1;
position: relative;
overflow: hidden;
cursor: pointer;
}
.link-external-wallet-page .body-wrapper .content-wrapper .button-wrapper .connect-button .logo{
height:20px;
filter: brightness(0) contrast(1) invert(1);
}

.link-external-wallet-page .body-wrapper .info-text{
color:#555;
font-size:14px;
font-family: sans-serif;
font-weight:400;
width:100%;
margin:15px 0 0;
line-height:19px;
}









/* DARK MODE */
body.dark-theme .link-external-wallet-page .body-wrapper .heading{
color:rgba(255,255,255,0.9);
}
body.dark-theme .link-external-wallet-page .body-wrapper .sub-heading-text{
color:rgba(255,255,255,0.7);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper{
background:var(--light-black);
border:1px solid rgba(255,255,255,0.1);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper .title{
color:rgba(255,255,255,0.8);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper .sub-text{
color:rgba(255,255,255,0.7);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper>.input-field{
color:rgba(255,255,255,0.9);
border:1px solid rgba(255,255,255,0.1);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper #data{
border:1px solid rgba(255,255,255,0.1);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper #data .input-field-wrapper .input-field{
color:rgba(255,255,255,0.9);
}
body.dark-theme .link-external-wallet-page .body-wrapper .content-wrapper .button-wrapper .connect-button{
    border: none;
}
body.dark-theme .link-external-wallet-page .body-wrapper .info-text{
color:rgba(255,255,255,0.7);
}


@media screen and (min-width: 950px) {
    .link-external-wallet-page{
        padding:0 0 0 300px;
    }
}.send-page{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}
.send-page .select-coin-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform:translateX(-100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.send-page .select-coin-page.show {
transform: translateX(0);
}

.send-page .select-coin-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.send-page .select-coin-page .body-wrapper .search-field-wrapper{
width:100%;
height:50px;
border: 1px solid #e5e5e5;
background: #f5f5f5;
border-radius:10px;
display:flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap:wrap;
gap:0;
overflow:hidden;
margin:15px 0 0;
}
.send-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
width:50px;
height:calc(100% - 10px);
border:none;
border-right: 1px solid #e5e5e5;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
font-size:14px;
color:#444;
}
.send-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
width:calc(100% - 100px);
height:100%;
border:none;
background:transparent;
font-size:14px;
color:#444;
text-indent: 15px;
}
.send-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper{
width:50px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
}
.send-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
width: 100%;
height: 100%;
border: none;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
color: var(--dark-blue);
position: relative;
overflow: hidden;
cursor: pointer;
padding: 0;
}

.send-page .select-coin-page .body-wrapper .main-platform{
width:100%;
background:#fff;
margin:20px 0 0;
padding:0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
width:100%;
height:40px;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:0;
padding:0;
border:none;
transition:0.2s;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .coin-logo{
width:40px;
height:40px;
border-radius:50%;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper{
width:calc(100% - 55px);
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:2px;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:15px;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .show-value{
display:flex;
align-items: center;
justify-content:flex-end;
flex-direction:row;
flex-wrap:nowrap;
gap:5px;
text-align: right;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .value{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .activate-button{
display:none;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .pending-button{
display:none;
}


.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper{
width:calc(100% - 55px - 90px);
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .activate-button{
width:75px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}



.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper{
width:calc(100% - 55px - 100px);
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .pending-button{
width:85px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}

.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.show-value .show-value{
display:inline;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.show-value .hide-value{
display:none;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.hide-value .show-value{
display:none !important;
}
.send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.hide-value .hide-value{
display: flex;
align-items: center;
font-family: 'fontawesome';
letter-spacing: 3px;
font-size: 10px;
}

.send-page .select-coin-page .body-wrapper .main-platform .not-found-text{
width:min(500px , calc(100% - 40px));
padding:30px 20px;
margin:auto;
background:#f5f5f5;
border:1px solid #d1d1d1;
font-family: sans-serif;
font-size:15px;
color:#555;
font-weight:550;
text-align: center;
border-radius:10px;
}









.send-page .select-network-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.send-page .select-network-page.show{
transform: translateX(0);
}

.send-page .select-network-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.send-page .select-network-page .body-wrapper .heading{
width:100%;
font-family:'fontawesome';
color:#444;
letter-spacing:0.5mm;
font-size:14px;
margin:20px 0 0;
}
.send-page .select-network-page .body-wrapper .main-platform{
width:100%;
background:transparent;
margin:15px 0 0;
padding:0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
}
.send-page .select-network-page .body-wrapper .main-platform .button{
width:100%;
border:none;
background:#f5f5f5;
border-radius:5px;
color:#444;
font-family:sans-serif;
font-size:15px;
height:60px;
padding:0 20px;
display:flex;
align-items:center;
justify-content: flex-start;
gap: 10px;
box-shadow:0 0 5px 2px rgba(0,0,0,0.2);
transition:0.2s;
text-transform:uppercase;
position: relative;
overflow: hidden;
cursor: pointer;
}
.send-page .select-network-page .body-wrapper .main-platform .not-found-text{
width:min(100% , 500px);
padding:30px 20px;
border: 1px solid #d1d1d1;
background:#f5f5f5;
border-radius:10px;
color:#444;
font-weight:550;
font-family: sans-serif;
font-size: 15px;
text-align: center;
}

.send-page .select-network-page .body-wrapper .button-wrapper{
display: flex;
align-items: center;
justify-content: center;
margin: 20px 0 0;
width:100%;
}
.send-page .select-network-page .body-wrapper .button-wrapper .back-button{
padding: 15px 20px;
background: #f44;
color: rgba(255, 255, 255,0.9);
font-family: 'fontawesome';
font-size: 12px;
letter-spacing: 0.4mm;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
box-shadow: 0 0 5px 1px rgba(0,0,0,0.1);
border-radius: 5px;
border: none;
position: relative;
overflow: hidden;
cursor: pointer;
}







.send-page .send-crypto-page {
position: fixed;
top: 0;
left:0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.send-page .send-crypto-page.show{
transform: translateX(0);
}

.send-page .send-crypto-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}
    
.send-page .send-crypto-page .body-wrapper .main-platform{
width:100%;
background:transparent;
margin:30px 0 0;
padding:0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0 15px;
}
.send-page .send-crypto-page .body-wrapper .main-platform .heading{
width:100%;
font-family:'fontawesome';
color:#444;
letter-spacing:0.5mm;
font-size:15px;
text-align:center;
}

.send-page .send-crypto-page .body-wrapper .main-platform .title{
width:100%;
font-family:sans-serif;
color:#555;
font-size:15px;
font-weight:550;
margin:25px 0 7px;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-button{
display: flex;
align-items:center;
justify-content:center;
width:calc(50% - 7.5px);
height:60px;
padding:0 15px;
border:1px solid #d1d1d1;
background:#f8f8f8;
border-radius:5px;
overflow:hidden;
color:#555;
transition: 0.2s;
position: relative;
overflow: hidden;
cursor: pointer;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-button .image{
max-height: calc(100% - 20px);
max-width: 100%;
border-radius: 5px;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-button .image.white{
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-button .text{
width: 100%;
color: inherit;
font-family: 'fontawesome';
font-size: 14px;
font-weight: 500;
letter-spacing: 0.4mm;
line-height: 18px;
text-align: center;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox{
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked+.send-type-button{
background:var(--blue);
border:none;
color:rgba(255, 255, 255, 0.9);
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked+.send-type-button .image.coloured{
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked+.send-type-button .image.white{
display:block;
}

.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked~.input-field-wrapper-container{
display:flex;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox#send-page_send-internal:checked~.input-field-wrapper-container:first-of-type #email-or-wallet-address-text{
display:flex;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox#send-page_send-internal:checked~.input-field-wrapper-container:first-of-type #wallet-address-text{
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox#send-page_send-external:checked~.input-field-wrapper-container:first-of-type #email-or-wallet-address-text{
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .send-type-checkbox#send-page_send-external:checked~.input-field-wrapper-container:first-of-type #wallet-address-text{
display:flex;
}


.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:5px;
width:100%;
margin:15px 0 0;
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper{
height:60px;
width:100%;
background: transparent;
border: 1px solid #d1d1d1;
border-radius:5px;
position:relative;
overflow:hidden;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .icon{
width:50px;
height: 100%;
position:absolute;
top:0;
left:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
cursor:text;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .placeholder-text{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: flex-start;
font-family:sans-serif;
transition:.2s;
cursor:text;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper.password .placeholder-text{
width:calc(100% - 100px);
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#444;
font-size:14px;
border: none;
z-index: 1;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper.password .input-field{
width:calc(100% - 100px);
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field:focus~.placeholder-text{
height: 11px;
top:4px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field:valid~.placeholder-text{
height: 11px;
top:4px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .toggle-password-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:none;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper.password .toggle-password-button{
display:flex;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-closed-icon{
display:block;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-open-icon{
display:none;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-open-icon{
display:block;
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-closed-icon{
display:none;
}


.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper.small-field .placeholder-text{
width:calc(100% - 100px);
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper.small-field .input-field{
width:calc(100% - 100px);
}
.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .max-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:var(--blue);
font-family:sans-serif;
font-weight:550;
font-size:13px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
}


.send-page .send-crypto-page .body-wrapper .main-platform .error-text-wrapper{
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
padding: 10px 15px;
border-radius: 5px;
margin:0;
width: 100%;
background: #f8f8f8;
gap: 5px;
border: 1px solid #d1d1d1;
}
.send-page .send-crypto-page .body-wrapper .main-platform .error-text-wrapper.show{
display:flex;
}
.send-page .send-crypto-page .body-wrapper .main-platform .error-text-wrapper .error-text{
font-family: var(--default-font);
font-size: 11px;
color: #f55;
font-weight: 500;
width: 100%;
line-height: 14px;
display: none;
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
gap: 10px
}
.send-page .send-crypto-page .body-wrapper .main-platform .error-text-wrapper .error-text.show{
display:flex;
}

.send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .send-button{
height:50px;
padding:0 20px;
display:flex;
align-items: center;
justify-content: center;
gap:8px;
color:rgba(255, 255, 255, 0.9);
font-family: sans-serif;
font-size: 15px;
background:var(--green);
border: none;
border-radius: 5px;
margin:15px 0 0;
position: relative;
overflow: hidden;
cursor: pointer;
}

.send-page .send-crypto-page .body-wrapper .main-platform .back-button{
height:50px;
padding:0 20px;
display:flex;
align-items: center;
justify-content: center;
gap:8px;
color:#f44;
font-family: sans-serif;
font-size: 15px;
background:transparent;
border: none;
border-radius: 5px;
margin:5px 0 0;
position: relative;
overflow: hidden;
cursor: pointer;
}



/* DARK MODE */
body.dark-theme .send-page .select-coin-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
color: rgba(255, 255, 255, 0.9);
border-right:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
color:var(--light-blue);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform{
background:transparent;
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
background:transparent;
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .send-page .select-network-page .body-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .select-network-page .body-wrapper .main-platform .button{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
}
body.dark-theme .send-page .select-network-page .body-wrapper .main-platform .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}

body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .send-type-button{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .send-type-button .image.coloured{
display:none;
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .send-type-button .image.white{
display:block;
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper{
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .icon{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .placeholder-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper .max-button{
color:dodgerblue;
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .dollar-amount-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .send-page .send-crypto-page .body-wrapper .main-platform .error-text-wrapper{
background:rgba(0,0,0,0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}


@media screen and (min-width: 950px) {
    
    .send-page .select-coin-page{
        padding:0 0 0 300px;
    }
    .send-page .select-network-page{
        padding:0 0 0 300px;
    }
    .send-page .send-crypto-page{
        padding:0 0 0 300px;
    }

    .send-page .select-coin-page .body-wrapper .main-platform{
        gap:15px;
        justify-content: flex-start;
    }
    .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
        width: calc(50% - 7.5px);
        border: 1px solid #d1d1d1;
        background: #f5f5f5;
        border-radius: 5px;
        height: 60px;
        padding: 0 15px;
    }

    .send-page .select-network-page .body-wrapper .main-platform .button{
        width:calc(50% - 10px);
    }
    .send-page .select-network-page .body-wrapper{
        width:500px;
        margin:auto;
    }
    .send-page .select-network-page .body-wrapper .heading{
        text-align: center;
    }

    .send-page .send-crypto-page .body-wrapper{
        width:500px;
        margin:auto;
    }

    
    /* DARK MODE */
    body.dark-theme .send-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
}.receive-page{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}
.receive-page .select-coin-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform:translateX(-100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.receive-page .select-coin-page.show {
transform: translateX(0);
}

.receive-page .select-coin-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.receive-page .select-coin-page .body-wrapper .search-field-wrapper{
width:100%;
height:50px;
border: 1px solid #e5e5e5;
background: #f5f5f5;
border-radius:10px;
display:flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap:wrap;
gap:0;
overflow:hidden;
margin:15px 0 0;
}
.receive-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
width:50px;
height:calc(100% - 10px);
border:none;
border-right: 1px solid #e5e5e5;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
font-size:14px;
color:#444;
}
.receive-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
width:calc(100% - 100px);
height:100%;
border:none;
background:transparent;
font-size:14px;
color:#444;
text-indent: 15px;
}
.receive-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper{
width:50px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
}
.receive-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
width: 100%;
height: 100%;
border: none;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
color: var(--dark-blue);
position: relative;
overflow: hidden;
cursor: pointer;
padding: 0;
}

.receive-page .select-coin-page .body-wrapper .main-platform{
width:100%;
background:#fff;
margin:20px 0 0;
padding:0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
width:100%;
height:40px;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:0;
padding:0;
border:none;
transition:0.2s;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .coin-logo{
width:40px;
height:40px;
border-radius:50%;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper{
width:calc(100% - 55px);
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:2px;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:15px;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .show-value{
display:flex;
align-items: center;
justify-content:flex-end;
flex-direction:row;
flex-wrap:nowrap;
gap:5px;
text-align: right;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .value{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .activate-button{
display:none;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .pending-button{
display:none;
}


.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper{
width:calc(100% - 55px - 90px);
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.inactive .activate-button{
width:75px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}



.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper{
width:calc(100% - 55px - 100px);
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.pending .pending-button{
width:85px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}

.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.show-value .show-value{
display:inline;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.show-value .hide-value{
display:none;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.hide-value .show-value{
display:none !important;
}
.receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper.hide-value .hide-value{
display: flex;
align-items: center;
font-family: 'fontawesome';
letter-spacing: 3px;
font-size: 10px;
}

.receive-page .select-coin-page .body-wrapper .main-platform .not-found-text{
width:min(500px , calc(100% - 40px));
padding:30px 20px;
margin:auto;
background:#f5f5f5;
border:1px solid #d1d1d1;
font-family: sans-serif;
font-size:15px;
color:#555;
font-weight:550;
text-align: center;
border-radius:10px;
}












.receive-page .select-network-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.receive-page .select-network-page.show{
transform: translateX(0);
}

.receive-page .select-network-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.receive-page .select-network-page .body-wrapper .heading{
width:100%;
font-family:'fontawesome';
color:#444;
letter-spacing:0.5mm;
font-size:14px;
margin:20px 0 0;
}
.receive-page .select-network-page .body-wrapper .main-platform{
width:100%;
background:transparent;
margin:15px 0 0;
padding:0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
}
.receive-page .select-network-page .body-wrapper .main-platform .button{
width:100%;
border:none;
background:#f5f5f5;
border-radius:5px;
color:#444;
font-family:sans-serif;
font-size:15px;
height:60px;
padding:0 20px;
display:flex;
align-items:center;
justify-content: flex-start;
gap: 10px;
box-shadow:0 0 5px 2px rgba(0,0,0,0.2);
transition:0.2s;
text-transform:uppercase;
position: relative;
overflow: hidden;
cursor: pointer;
}
.receive-page .select-network-page .body-wrapper .main-platform .not-found-text{
width:min(100% , 500px);
padding:30px 20px;
border: 1px solid #d1d1d1;
background:#f5f5f5;
border-radius:10px;
color:#444;
font-weight:550;
font-family: sans-serif;
font-size: 15px;
text-align: center;
}

.receive-page .select-network-page .body-wrapper .button-wrapper{
display: flex;
align-items: center;
justify-content: center;
margin: 20px 0 0;
width:100%;
}
.receive-page .select-network-page .body-wrapper .button-wrapper .back-button{
padding: 15px 20px;
background: #f44;
color: rgba(255, 255, 255,0.9);
font-family: 'fontawesome';
font-size: 12px;
letter-spacing: 0.4mm;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
box-shadow: 0 0 5px 1px rgba(0,0,0,0.1);
border-radius: 5px;
border: none;
position: relative;
overflow: hidden;
cursor: pointer;
}














.receive-page .receive-crypto-page {
position: fixed;
top: 0;
left:0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.receive-page .receive-crypto-page.show{
transform: translateX(0);
}

.receive-page .receive-crypto-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}
    
.receive-page .receive-crypto-page .body-wrapper .main-platform{
width:100%;
background:transparent;
margin:30px 0 0;
padding:0;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0 15px;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .heading{
width:100%;
font-family:'fontawesome';
color:#444;
letter-spacing:0.5mm;
font-size:15px;
text-align:center;
}

.receive-page .receive-crypto-page .body-wrapper .main-platform .title{
width:100%;
font-family:sans-serif;
color:#555;
font-size:15px;
font-weight:550;
margin:25px 0 7px;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button{
display: flex;
align-items:center;
justify-content:center;
width:calc(50% - 7.5px);
height:60px;
padding:0 15px;
border:1px solid #d1d1d1;
background:#f8f8f8;
border-radius:5px;
overflow:hidden;
color:#555;
transition: 0.2s;
position: relative;
overflow: hidden;
cursor: pointer;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button .image{
max-height: calc(100% - 20px);
max-width: 100%;
border-radius: 5px;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button .image.white{
display:none;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button .text{
width: 100%;
color: inherit;
font-family: 'fontawesome';
font-size: 14px;
font-weight: 500;
letter-spacing: 0.4mm;
line-height: 18px;
text-align: center;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-checkbox{
display:none;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked+.send-type-button{
background:var(--blue);
border:none;
color:rgba(255, 255, 255, 0.9);
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked+.send-type-button .image.coloured{
display:none;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-checkbox:checked+.send-type-button .image.white{
display:block;
}


.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-checkbox#receive-page_send-internal:checked~.input-field-wrapper-container.internal-wrapper{
display:flex;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-checkbox#receive-page_send-external:checked~.input-field-wrapper-container.external-wrapper{
display:flex;
}


.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:0 15px;
width:100%;
margin: 0;
display:none;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .info-text{
margin:15px 0 0;
color:#444;
font-family: sans-serif;
font-size:14px;
width:100%;
line-height:19px;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper{
height:60px;
width:100%;
background: transparent;
border: 1px solid #d1d1d1;
border-radius:5px;
position:relative;
overflow:hidden;
margin:15px 0 0;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .icon{
width:50px;
height: 100%;
position:absolute;
top:0;
left:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
cursor:text;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .placeholder-text{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: flex-start;
font-family:sans-serif;
transition:.2s;
cursor:text;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper.password .placeholder-text{
width:calc(100% - 100px);
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#444;
font-size:14px;
border: none;
z-index: 1;
display:flex;
align-items:center;
justify-content:flex-start;
word-break: break-word;
line-height: 13px;
font-weight: 550;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper.password .input-field{
width:calc(100% - 100px);
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field:focus~.placeholder-text{
height: 11px;
top:4px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field:valid~.placeholder-text{
height: 11px;
top:4px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field.text~.placeholder-text{
height: 11px;
top:4px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .toggle-password-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:none;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper.password .toggle-password-button{
display:flex;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-closed-icon{
display:block;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-open-icon{
display:none;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-open-icon{
display:block;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-closed-icon{
display:none;
}


.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper.small-field .placeholder-text{
width:calc(100% - 100px);
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper.small-field .input-field{
width:calc(100% - 100px);
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .copy-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:var(--blue);
font-size:18px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .qr-code{
width:min(200px , 100%);
aspect-ratio:1/1;
border:1px solid #d1d1d1;
border-radius:5px;
margin:15px 0 0;
padding: 8px;
}


.receive-page .receive-crypto-page .body-wrapper .main-platform .error-text-wrapper{
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
padding: 10px 15px;
border-radius: 5px;
margin: 10px 0 0;
width: 100%;
background: #f8f8f8;
gap: 5px;
border: 1px solid #d1d1d1;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .error-text-wrapper.show{
display:flex;
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .error-text-wrapper .error-text{
font-family: var(--default-font);
font-size: 11px;
color: #f55;
font-weight: 500;
width: 100%;
line-height: 14px;
display: none;
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
gap: 10px
}
.receive-page .receive-crypto-page .body-wrapper .main-platform .error-text-wrapper .error-text.show{
display:flex;
}

.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .dollar-amount-text{
width:100%;
font-family:'fontawesome';
font-size:12px;
color:#555;
letter-spacing:0.4mm;
font-weight:550;
margin:5px 0 0;
}

.receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .send-button{
height:50px;
padding:0 20px;
display:flex;
align-items: center;
justify-content: center;
gap:8px;
color:rgba(255, 255, 255, 0.9);
font-family: sans-serif;
font-size: 15px;
background:var(--green);
border: none;
border-radius: 5px;
margin:15px 0 0;
position: relative;
overflow: hidden;
cursor: pointer;
}

.receive-page .receive-crypto-page .body-wrapper .main-platform .back-button{
height:50px;
padding:0 20px;
display:flex;
align-items: center;
justify-content: center;
gap:8px;
color:#f44;
font-family: sans-serif;
font-size: 15px;
background:transparent;
border: none;
border-radius: 5px;
margin:15px 0 0;
position: relative;
overflow: hidden;
cursor: pointer;
}






/* DARK MODE */
body.dark-theme .receive-page .select-coin-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
color: rgba(255, 255, 255, 0.9);
border-right:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
color:var(--light-blue);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform{
background:transparent;
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
background:transparent;
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .receive-page .select-network-page .body-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .select-network-page .body-wrapper .main-platform .button{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
}
body.dark-theme .receive-page .select-network-page .body-wrapper .main-platform .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button .image.coloured{
display:none;
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .send-type-button .image.white{
display:block;
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .info-text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper{
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .icon{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .placeholder-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .input-field{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .max-button{
color:dodgerblue;
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper .copy-button{
color:dodgerblue;
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .input-field-wrapper-container .dollar-amount-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .error-text-wrapper{
background:rgba(0,0,0,0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .receive-page .receive-crypto-page .body-wrapper .main-platform .qr-code{
border:1px solid rgba(255, 255, 255, 0.1);
}


@media screen and (min-width: 950px) {
    
    .receive-page .select-coin-page{
        padding:0 0 0 300px;
    }
    .receive-page .select-network-page{
        padding:0 0 0 300px;
    }
    .receive-page .receive-crypto-page{
        padding:0 0 0 300px;
    }
    .receive-page .select-coin-page .body-wrapper .main-platform{
        gap:15px;
        justify-content: flex-start;
    }
    .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
        width: calc(50% - 7.5px);
        border: 1px solid #d1d1d1;
        background: #f5f5f5;
        border-radius: 5px;
        height: 60px;
        padding: 0 15px;
    }
    .receive-page .select-network-page .body-wrapper .main-platform .button{
        width:calc(50% - 10px);
    }
    .receive-page .select-network-page .body-wrapper{
        width:500px;
        margin:auto;
    }
    .receive-page .select-network-page .body-wrapper .heading{
        text-align: center;
    }

    .receive-page .receive-crypto-page .body-wrapper{
        width:500px;
        margin:auto;
    }

    
    /* DARK MODE */
    body.dark-theme .receive-page .select-coin-page .body-wrapper .main-platform .coin-content-wrapper{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
}.swap-page{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}
.swap-page .swap-crypto-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.swap-page .swap-crypto-page.show {
transform: translateX(0);
}

.swap-page .swap-crypto-page .body-wrapper{
width: min(100%, 600px);
padding: 60px 20px 100px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
margin: auto;
}

.swap-page .swap-crypto-page .body-wrapper .heading{
font-family: 'fontawesome';
font-size: 23px;
font-weight: 600;
color: #555;
letter-spacing: 0.5mm;
width: 100%;
margin:25px 0 0;
}
.swap-page .swap-crypto-page .body-wrapper .heading-sub-text{
font-family:sans-serif;
font-size:15px;
font-weight:400;
color:#555;
width:100%;
margin:7px 0 0;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:25px 0 0;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper{
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
gap: 0;
border: 1px solid #e5e5e5;
padding: 15px;
border-radius: 15px;
background: #f9f9f9;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .title{
font-family:sans-serif;
font-size:15px;
font-weight:550;
color:#555;
width:100%;
text-transform:capitalize;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
margin:10px 0 0;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper{
display:flex;
align-items:center;
justify-content:flex-start;
position: relative;
overflow: hidden;
cursor: pointer;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .coin-logo-wrapper{
display:flex;
align-items:center;
justify-content:center;
width: 35px;
height: 35px;
border:none;
border-radius:50%;
background:transparent;
color:#444;
font-size:14px;
overflow:hidden;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .coin-logo-wrapper .coin-logo{
width:100%;
height:100%;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .text{
font-family:sans-serif;
font-size:14px;
color:#444;
font-weight:400;
margin:0 0 0 5px;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .icon{
font-size:14px;
color:#444;
margin:0 0 0 5px;
display:flex;
align-items: center;
justify-content:center;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .balance-text{
font-size:13px;
color:#444;
font-family: sans-serif;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper{
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:2px;
width:100%;
padding:20px;
border:1px solid #d1d1d1;
background:#f5f5f5;
border-radius:10px;
margin:5px 0 0;
transition: 0.2s;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper.error{
background: rgba(255, 0, 0, 0.05) !important;
border:1px solid #f44 !important;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper .input-field{
width:100%;
font-family: sans-serif;
font-size:15px;
color:#444;
font-weight:550;
border:none;
background: transparent;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper .dollar-amount-text{
width:100%;
font-family:sans-serif;
font-size:13px;
color:#444;
font-weight:550;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper .insufficient-balance-text{
width:100%;
font-family:sans-serif;
font-size:13px;
color:#f44;
font-weight:400;
display:none;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper .insufficient-balance-text.show{
display:block;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .swap-icon-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:center;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .swap-icon-wrapper .swap-icon{
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
color:#444;
border-radius: 50%;
border: 1px solid #e5e5e5;
background:#f9f9f9;
position: relative;
overflow: hidden;
cursor: pointer;
}
.swap-page .swap-crypto-page .body-wrapper .main-wrapper .swap-button{
height:50px;
padding:0 20px;
display:flex;
align-items:center;
justify-content:center;
gap:5px;
color:rgba(255, 255, 255, 0.9);
border-radius:5px;
border:none;
background:var(--blue);
font-weight:550;
position: relative;
overflow: hidden;
cursor: pointer;
}







.swap-page .select-coin-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.swap-page .select-coin-page.show{
transform: translateX(0);
}
.swap-page .select-coin-page .body-wrapper{
width: min(100%, 700px);
padding: 60px 20px 100px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
margin: auto;
}
.swap-page .select-coin-page .body-wrapper .top-wrapper{
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
padding:0;
margin:15px 0 0;
gap:0;
}
.swap-page .select-coin-page .body-wrapper .top-wrapper .heading{
font-family: 'fontawesome';
font-size: 16px;
font-weight: 400;
color: #444;
letter-spacing: 0.4mm;
text-align: center;
width:calc(100% - 50px);
padding:0 50px 0 0;
}
.swap-page .select-coin-page .body-wrapper .top-wrapper .close-button {
height: 50px;
width:50px;
display: flex;
align-items: center;
justify-content: center;
font-size:20px;
color: #444;
border: none;
background: transparent;
position: relative;
overflow: hidden;
cursor: pointer;
}

.swap-page .select-coin-page .body-wrapper .search-field-wrapper {
width: 100%;
height: 50px;
border: 1px solid #e5e5e5;
background:#f8f8f8;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
overflow: hidden;
margin:10px 0 0;
}
.swap-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
width:50px;
height:calc(100% - 10px);
border: none;
border-right: 1px solid #e5e5e5;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
font-size:14px;
color:#444;
}
.swap-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
width:calc(100% - 100px);
height:100%;
border:none;
background:transparent;
font-size:14px;
color:#444;
text-indent: 15px;
}
.swap-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper{
width:50px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
}
.swap-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
width: 100%;
height: 100%;
border: none;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
color: var(--dark-blue);
position: relative;
overflow: hidden;
cursor: pointer;
padding: 0;
}


.swap-page .select-coin-page .body-wrapper #data{
width:100%;
display:flex;
align-items:center;
justify-content:center;
align-content: flex-start;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
padding:0;
overflow:auto;
margin: 20px 0 0;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
width:100%;
height:40px;
background:transparent;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:0;
padding:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .coin-logo{
width:40px;
height:40px;
border-radius:50%;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper{
width:calc(100% - 55px);
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
gap:2px;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:15px;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
max-width: 80%;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .show-value{
display:flex;
align-items: center;
justify-content:flex-end;
flex-direction:row;
flex-wrap:nowrap;
gap:5px;
text-align: right;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance .value{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
max-width: 80%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .activate-button{
display:none;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .pending-button{
display:none;
}


.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.inactive .text-wrapper{
width:calc(100% - 55px - 90px);
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.inactive .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.inactive .activate-button{
width:75px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}


.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.pending .text-wrapper{
width:calc(100% - 55px - 100px);
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-name{
width: 100%;
max-width: unset;
text-align: left;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-price{
width: 100%;
max-width: unset;
text-align: left;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-balance{
display:none;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.pending .text-wrapper .inner-text-wrapper .coin-dollar-balance{
display:none;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.pending .pending-button{
width:85px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
font-family:sans-serif;
font-size:11px;
padding:10px 0;
background:var(--blue);
color:rgba(255,255,255,0.9);
border-radius:5px;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}

.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.show-value .show-value{
display:inline;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.show-value .hide-value{
display:none;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.hide-value .show-value{
display:none !important;
}
.swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper.hide-value .hide-value{
display: flex;
align-items: center;
font-family: 'fontawesome';
letter-spacing: 3px;
font-size: 10px;
}

.swap-page .select-coin-page .body-wrapper #data .not-found-text{
width:min(500px , 100%);
padding:30px 20px;
margin:auto;
background:#f5f5f5;
border:1px solid #d1d1d1;
font-family: sans-serif;
font-size:15px;
color:#555;
font-weight:550;
text-align: center;
border-radius:10px;
}








/* DARK MODE */
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .heading-sub-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper{
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .title{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .coin-logo-wrapper{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .left-wrapper .icon{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .top-content-wrapper .balance-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper{
background: rgba(0,0,0,0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper .input-field{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .content-wrapper .input-field-wrapper .dollar-amount-text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .swap-page .swap-crypto-page .body-wrapper .main-wrapper .swap-icon-wrapper .swap-icon{
color:rgba(255, 255, 255, 0.8);
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .swap-page .select-coin-page .body-wrapper .top-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper .top-wrapper .close-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
color: rgba(255, 255, 255, 0.9);
border-right:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
color:var(--light-blue);
}

body.dark-theme .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
background:transparent;
}
body.dark-theme .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-name{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-price{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .inner-text-wrapper .coin-dollar-balance{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .swap-page .select-coin-page .body-wrapper #data .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


@media screen and (min-width: 950px) {
    
    .swap-page .swap-crypto-page{
        padding:0 0 0 300px;
    }
    .swap-page .select-coin-page{
        padding:0 0 0 300px;
    }
    .swap-page .select-coin-page .body-wrapper #data{
        gap:15px;
        justify-content: flex-start;
    }
    .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
        width: calc(50% - 7.5px);
        border: 1px solid #d1d1d1;
        background: #f5f5f5;
        border-radius: 5px;
        height: 60px;
        padding: 0 15px;
    }

    
    /* DARK MODE */
    body.dark-theme .swap-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
}.trade-page{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}
.trade-page .select-coin-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.trade-page .select-coin-page.show{
transform: translateX(0);
}
.trade-page .select-coin-page .body-wrapper{
width: min(100%, 700px);
padding: 60px 20px 100px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
margin: auto;
}
.trade-page .select-coin-page .body-wrapper .top-wrapper{
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
padding:0;
margin:15px 0 0;
gap:0;
}
.trade-page .select-coin-page .body-wrapper .top-wrapper .heading{
font-family: 'fontawesome';
font-size: 16px;
font-weight: 400;
color: #444;
letter-spacing: 0.4mm;
text-align: center;
width:calc(100% - 50px);
padding:0 50px 0 0;
}
.trade-page .select-coin-page .body-wrapper .top-wrapper .close-button {
height: 50px;
width:50px;
display: flex;
align-items: center;
justify-content: center;
font-size:20px;
color: #444;
border: none;
background: transparent;
position: relative;
overflow: hidden;
cursor: pointer;
}

.trade-page .select-coin-page .body-wrapper .search-field-wrapper {
width: 100%;
height: 50px;
border: 1px solid #e5e5e5;
background:#f8f8f8;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
overflow: hidden;
margin:10px 0 0;
}
.trade-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
width:50px;
height:calc(100% - 10px);
border: none;
border-right: 1px solid #e5e5e5;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
font-size:14px;
color:#444;
}
.trade-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
width:calc(100% - 100px);
height:100%;
border:none;
background:transparent;
font-size:14px;
color:#444;
text-indent: 15px;
}
.trade-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper{
width:50px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
}
.trade-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
width: 100%;
height: 100%;
border: none;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
color: var(--dark-blue);
position: relative;
overflow: hidden;
cursor: pointer;
padding: 0;
}


.trade-page .select-coin-page .body-wrapper #data{
width:100%;
display:flex;
align-items:center;
justify-content:center;
align-content: flex-start;
flex-direction:row;
flex-wrap:wrap;
gap:20px;
padding:0;
overflow:auto;
margin: 20px 0 0;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
width:100%;
height:40px;
background:transparent;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:nowrap;
gap:0;
margin:0;
padding:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .coin-logo{
width:40px;
height:40px;
border-radius:50%;
}


.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper{
width:calc(100% - 110px);
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:wrap;
gap:5px;
padding:0 15px;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .coin-name{
color:#444;
font-family:sans-serif;
font-size:15px;
font-weight:550;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width:100%;
text-align: left;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .coin-price{
color:#555;
font-family:system-ui,sans-serif;
font-size:11px;
font-weight:400;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width:100%;
text-align: left;
}

.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .button-wrapper{
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:10px;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .button-wrapper .button {
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
gap: 0;
font-size: 12px;
padding: 0;
color: rgba(255, 255, 255, 0.9);
border-radius: 5px;
border: none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .button-wrapper .button.buy{
background: #20b16c;
}
.trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .button-wrapper .button.sell{
background: var(--red);
}

.trade-page .select-coin-page .body-wrapper #data .not-found-text{
width:min(500px , 100%);
padding:30px 20px;
margin:auto;
background:#f5f5f5;
border:1px solid #d1d1d1;
font-family: sans-serif;
font-size:15px;
color:#555;
font-weight:550;
text-align: center;
border-radius:10px;
}


















.trade-page .buy-crypto-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.trade-page .buy-crypto-page.show{
transform: translateX(0);
}
.trade-page .buy-crypto-page .body-wrapper{
margin:60px 0 95px;
width:100%;
height:calc(100% - 155px);
padding:0 20px;
display:flex;
align-items:center;
justify-content:flex-start;
flex-direction:column;
flex-wrap:nowrap;
gap:0;
overflow: hidden;
position:relative;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin:10px 0 0;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar{
    width: 120px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:row;
    flex-wrap: wrap;
    gap:0;
    border: none;
    border-radius:30px;
    overflow:hidden;
    border: 1px solid #e5e5e5;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button{
    width:50%;
    height:100%;
    border:none;
    background:#e9e9e9;
    color:#444;
    font-weight:400;
    font-size:13px;
    font-family: sans-serif;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button.buy-button{
    background:var(--green);
    color:rgba(255, 255, 255, 0.9);
    font-weight:550;
    box-shadow:0 0 3px 3px rgba(0,0,0,0.2);
    z-index: 1;
}

.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar{
    width: auto;
    height: 55px;
    border: 1px solid #e5e5e5;
    border-radius: 15px;
    overflow: hidden;
    padding: 0px 5px;
    background: #e9e9e9;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.5s ease 0s , height 0.5s ease 0.5s ;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button{
    width:100%;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border:none;
    background: transparent;
    padding:0;
    margin: 0;
    overflow:hidden;
    margin:0 0 3px 0;
    transition: 0.5s;
    transition-delay:0.5s;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo-wrapper{
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 50%;
    transition: 1s;
    transition-delay:1s;
    position: relative;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo-wrapper::before{
    content: "";
    position: absolute;
    top: 0;
    left: -128px;
    height: 100%;
    width: 150px;
    background: #e9e9e9;
    z-index:1;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo{
    height:100%;
    width:100%;
    border-radius:50%;
    position: absolute;
    top: 0;
    left: 0;
    z-index:2;
    transition:1s;
    transition-delay:1s;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-symbol{
    font-size:10px;
    font-weight:600;
    color:#444;
    font-family:'fontawesome';
    letter-spacing:0.3mm;
    margin:0 10px;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .icon{
    width:22px;
    height:22px;
    font-size:11px;
    color:#444;
    display: flex;
    align-items: center;
    justify-content: center;
}



.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .coin-balance-wrapper{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap:nowrap;
    gap: 2px;
    background: #e4f2ff;
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2) inset;
    padding: 0 8px;
    height: 20px;
    border-radius: 10px;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .coin-balance-wrapper .coin-value{
    display:block;
    font-family: sans-serif;
    font-size:10px;
    font-weight:400;
    color:#333;
    text-align: left;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width:50px;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .coin-balance-wrapper .icon{
    display:block;
    font-family: sans-serif;
    font-size:9px;
    font-weight:400;
    color:#333;
    text-align: right;
}


.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide{
    height: 30px;
    transform: translateX(calc(100% + 40px));
    transition: none;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide .select-coin-button{
    margin: 0;
    height: 0;
    transition: none;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide .select-coin-button .coin-logo-wrapper{
    transform: translateX(150px);
    transition: none;
}
.trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide .select-coin-button .coin-logo-wrapper .coin-logo{
    transform:rotate(460deg);
    transition: none;
}










.trade-page .buy-crypto-page .body-wrapper .display-wrapper{
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:column;
    flex-wrap:nowrap;
    gap:15px;
    position:absolute;
    top:65px;
    left:0;
    right:0;
    bottom:96px;
    margin: auto;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper .value-display{
    text-align: center;
    color: #444;
    font-size: 12px;
    font-weight: 400;
    font-family: sans-serif;
    padding: 0 20px;
    width: 100%;
    word-break: break-word;
    background: transparent;
    margin: 0 2px 0 3px;
    border: none;
    position: relative;
    overflow: auto;
    cursor: pointer;
}

.trade-page .buy-crypto-page .body-wrapper .display-wrapper .value-display .value{
    margin:0 2px;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper .toggle-display-type{
    display:none;
    align-items: center;
    justify-content: center;
    gap:5px;
    color:#555;
    font-size:12px;
    font-family: sans-serif;
    font-weight:400;
    background:#f5f5f5;
    border:1px solid #d1d1d1;
    border-radius:5px;
    padding:2px 10px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount{
    flex-direction:column;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .equals-icon{
    display:none;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .value{
    font-size: 50px;
    font-family: 'fontawesome';
    color: #555;
    font-weight: 400;
    letter-spacing: 1px;
    margin:0;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .name{
    font-size: 12px;
    font-family: 'fontawesome';
    color: #555;
    font-weight: 400;
    letter-spacing:0.3mm;
    margin:0px 0px 3px 3px;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount .toggle-display-type#toggle-display-by-amount{
    display:flex;
}


.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity{
    flex-direction:column-reverse;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .equals-icon{
    display:none;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .value{
    font-size: 50px;
    font-family: 'fontawesome';
    color: #555;
    font-weight: 400;
    letter-spacing: 1px;
    margin:0;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .name{
    font-size: 12px;
    font-family: 'fontawesome';
    color: #555;
    font-weight: 400;
    letter-spacing:0.3mm;
    margin:0px 0px 3px 3px;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity .toggle-display-type#toggle-display-by-quantity{
    display:flex;
}



.trade-page .buy-crypto-page .body-wrapper .footer-toolbar {
    width: min(500px , calc(100% - 40px));
    display: flex;
    align-items: center;
    justify-content:center;
    flex-direction:column;
    flex-wrap:nowrap;
    gap:0;
    position:absolute;
    bottom:0;
    right:0;
    left:0;
    margin:auto;
    z-index:1;
    padding:0;
    box-shadow:0 0 7px 3px rgba(0,0,0,0.1);
    border-radius:10px;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content:center;
    flex-direction:row;
    flex-wrap:nowrap;
    gap:8px;
    border:1px solid #f5f5f5;
    border-radius:10px 10px 0 0;
    background:linear-gradient(45deg, #f5f5f5, #f8f8f8);
    padding:10px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content .card-image-wrapper{
    width:30px;
    height:auto;
    display: flex;
    align-items: center;
    justify-content:center;
    flex-direction:column;
    flex-wrap:nowrap;
    gap:2px;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content .card-image-wrapper .card-image{
    width:100%;
    height:15px;
    border:none;
    border-radius:3px;
    overflow: hidden;
    display:flex;
    align-items: center;
    justify-content:center;
    background:#fff;
    border:1px solid #e5e5e5;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content .card-image-wrapper .card-image img{
    max-width:calc(100% - 3px);
    max-height:calc(100% - 3px);
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .text-wrapper{
    display: flex;
    align-items:center;
    justify-content:center;
    flex-direction: column;
    flex-wrap:nowrap;
    gap:10px;
    width:100%;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .text-wrapper{
    display: flex;
    align-items:flex-start;
    justify-content:center;
    flex-direction: column;
    flex-wrap:nowrap;
    gap:4px;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .text-wrapper .title{
    font-size:14px;
    font-weight:400;
    font-family: sans-serif;
    color:#444;
}
.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .text-wrapper .text{
    font-size:12px;
    font-weight:550;
    font-family: sans-serif;
    color:var(--green);
}

.trade-page .buy-crypto-page .body-wrapper .footer-toolbar .submit-button{
    width:100%;
    height: 40px;
    display:flex;
    align-items: center;
    justify-content: center;
    gap:10px;
    font-family:sans-serif;
    font-size:14px;
    padding:0 20px;
    background:linear-gradient(45deg, var(--dark-green), var(--green));
    color:rgba(255,255,255,0.9);
    border-radius:0 0 10px 10px;
    border:1px solid var(--dark-green);
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.trade-page .buy-crypto-page .body-wrapper .display-wrapper .by-amount-input{
    position: fixed;
    top: -100%;
    left: 0;
    z-index: 999;
}
.trade-page .buy-crypto-page .body-wrapper .display-wrapper .by-quantity-input{
    position: fixed;
    top: -100%;
    left: 0;
    z-index: 999;
}


















































.trade-page .sell-crypto-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.trade-page .sell-crypto-page.show{
transform: translateX(0);
}
.trade-page .sell-crypto-page .body-wrapper{
margin:60px 0 95px;
width:100%;
height:calc(100% - 155px);
padding:0 20px;
display:flex;
align-items:center;
justify-content:flex-start;
flex-direction:column;
flex-wrap:nowrap;
gap:0;
overflow: hidden;
position:relative;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
margin:10px 0 0;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar{
width: 120px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
flex-direction:row;
flex-wrap: wrap;
gap:0;
border: none;
border-radius:30px;
overflow:hidden;
border: 1px solid #e5e5e5;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button{
width:50%;
height:100%;
border:none;
background:#e9e9e9;
color:#444;
font-weight:400;
font-size:13px;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button.sell-button{
background: var(--red);
color:rgba(255, 255, 255, 0.9);
font-weight:550;
box-shadow:0 0 3px 3px rgba(0,0,0,0.2);
z-index: 1;
}

.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar{
width: auto;
height: 55px;
border: 1px solid #e5e5e5;
border-radius: 15px;
overflow: hidden;
padding: 0px 5px;
background: #e9e9e9;
position: relative;
overflow: hidden;
cursor: pointer;
transition: transform 0.5s ease 0s , height 0.5s ease 0.5s ;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button{
width:100%;
height: 22px;
display: flex;
align-items: center;
justify-content: space-between;
border:none;
background: transparent;
padding:0;
margin: 0;
overflow:hidden;
margin:0 0 3px 0;
transition: 0.5s;
transition-delay:0.5s;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo-wrapper{
width: 22px;
height: 22px;
border: none;
border-radius: 50%;
transition: 1s;
transition-delay:1s;
position: relative;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo-wrapper::before{
content: "";
position: absolute;
top: 0;
left: -128px;
height: 100%;
width: 150px;
background: #e9e9e9;
z-index:1;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo{
height:100%;
width:100%;
position: absolute;
top: 0;
left: 0;
z-index:2;
transition:1s;
transition-delay:1s;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-symbol{
font-size:10px;
font-weight:600;
color:#444;
font-family:'fontawesome';
letter-spacing:0.3mm;
margin:0 10px;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .icon{
width:22px;
height:22px;
font-size:11px;
color:#444;
display: flex;
align-items: center;
justify-content: center;
}



.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .coin-balance-wrapper{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: row;
flex-wrap:nowrap;
gap: 2px;
background: #e4f2ff;
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2) inset;
padding: 0 8px;
height: 20px;
border-radius: 10px;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .coin-balance-wrapper .coin-value{
display:block;
font-family: sans-serif;
font-size:10px;
font-weight:400;
color:#333;
text-align: left;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width:50px;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .coin-balance-wrapper .icon{
display:block;
font-family: sans-serif;
font-size:9px;
font-weight:400;
color:#333;
text-align: right;
}


.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide{
height: 30px;
transform: translateX(calc(100% + 40px));
transition: none;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide .select-coin-button{
margin: 0;
height: 0;
transition: none;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide .select-coin-button .coin-logo-wrapper{
transform: translateX(150px);
transition: none;
}
.trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar.hide .select-coin-button .coin-logo-wrapper .coin-logo{
transform:rotate(460deg);
transition: none;
}










.trade-page .sell-crypto-page .body-wrapper .display-wrapper{
width: 100%;
height: auto;
display: flex;
align-items: center;
justify-content: center;
flex-direction:column;
flex-wrap:nowrap;
gap:15px;
position:absolute;
top:65px;
left:0;
right:0;
bottom:95px;
margin: auto;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper .value-display{
text-align: center;
color: #444;
font-size: 12px;
font-weight: 400;
font-family: sans-serif;
padding: 0 20px;
width: 100%;
word-break: break-word;
background: transparent;
margin: 0 2px 0 3px;
border: none;
position: relative;
overflow: auto;
cursor: pointer;
}

.trade-page .sell-crypto-page .body-wrapper .display-wrapper .value-display .value{
margin:0 2px;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper .toggle-display-type{
display:none;
align-items: center;
justify-content: center;
gap:5px;
color:#555;
font-size:12px;
font-family: sans-serif;
font-weight:400;
background:#f5f5f5;
border:1px solid #d1d1d1;
border-radius:5px;
padding:2px 10px;
position: relative;
overflow: hidden;
cursor: pointer;
}

.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount{
flex-direction:column;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .equals-icon{
display:none;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .value{
font-size: 50px;
font-family: 'fontawesome';
color: #555;
font-weight: 400;
letter-spacing: 1px;
margin:0;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .name{
font-size: 12px;
font-family: 'fontawesome';
color: #555;
font-weight: 400;
letter-spacing:0.3mm;
margin:0px 0px 3px 3px;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount .toggle-display-type#toggle-display-by-amount{
display:flex;
}


.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity{
flex-direction:column-reverse;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .equals-icon{
display:none;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .value{
font-size: 50px;
font-family: 'fontawesome';
color: #555;
font-weight: 400;
letter-spacing: 1px;
margin:0;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .name{
font-size: 12px;
font-family: 'fontawesome';
color: #555;
font-weight: 400;
letter-spacing:0.3mm;
margin:0px 0px 3px 3px;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity .toggle-display-type#toggle-display-by-quantity{
display:flex;
}



.trade-page .sell-crypto-page .body-wrapper .footer-toolbar {
width: min(500px , calc(100% - 40px));
display: flex;
align-items: center;
justify-content:center;
flex-direction:column;
flex-wrap:nowrap;
gap:0;
position:absolute;
bottom:0;
right:0;
left:0;
margin:auto;
z-index:1;
padding:0;
box-shadow:0 0 7px 3px rgba(0,0,0,0.1);
border-radius:10px;
}
.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content{
width: 100%;
display: flex;
align-items: center;
justify-content:center;
flex-direction:row;
flex-wrap:nowrap;
gap:8px;
border:1px solid #f5f5f5;
border-radius:10px 10px 0 0;
background:linear-gradient(45deg, #f5f5f5, #f8f8f8);
padding:10px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content .mercuryo-logo {
width: 30px;
height: 30px;
border-radius:50%;
border:1px solid #e5e5e5;
}
.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .text-wrapper{
display: flex;
align-items:center;
justify-content:center;
flex-direction: column;
flex-wrap:nowrap;
gap:10px;
width:100%;
}
.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .text-wrapper{
display: flex;
align-items:flex-start;
justify-content:center;
flex-direction: column;
flex-wrap:nowrap;
gap:1px;
}
.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .text-wrapper .title{
font-size:14px;
font-weight:400;
font-family: sans-serif;
color:#444;
}
.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .text-wrapper .text{
font-size:12px;
font-weight:550;
font-family: sans-serif;
color:var(--green);
}

.trade-page .sell-crypto-page .body-wrapper .footer-toolbar .submit-button{
width:100%;
height: 40px;
display:flex;
align-items: center;
justify-content: center;
gap:10px;
font-family:sans-serif;
font-size:14px;
padding:0 20px;
background:linear-gradient(45deg, var(--red), var(--pink));
color:rgba(255,255,255,0.9);
border-radius:0 0 10px 10px;
border:1px solid var(--red);
position: relative;
overflow: hidden;
cursor: pointer;
}

.trade-page .sell-crypto-page .body-wrapper .display-wrapper .by-amount-input{
position: fixed;
top: -100%;
left: 0;
z-index: 999;
}
.trade-page .sell-crypto-page .body-wrapper .display-wrapper .by-quantity-input{
position: fixed;
top: -100%;
left: 0;
z-index: 999;
}

























/* DARK MODE */
body.dark-theme .trade-page .select-coin-page .body-wrapper .top-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper .top-wrapper .close-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper .search-field-wrapper .back-button{
color: rgba(255, 255, 255, 0.9);
border-right:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper .search-field-wrapper .search-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
color:var(--light-blue);
}

body.dark-theme .trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
background:transparent;
}
body.dark-theme .trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .coin-name{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper .text-wrapper .coin-price{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .trade-page .select-coin-page .body-wrapper #data .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}








body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar{
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button{
background:var(--light-black);
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button.buy-button{
background:var(--green);
box-shadow: 0 0 6px 3px rgba(53, 185, 114, 0.5);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar{
border:1px solid rgba(255, 255, 255, 0.1);
background:var(--light-black);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo-wrapper::before{
background:var(--light-black);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-symbol{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .icon{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .display-wrapper .value-display{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .value{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .name{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .value{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .name{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .display-wrapper .toggle-display-type{
border:1px solid rgba(255, 255, 255, 0.1);
background:var(--light-black);
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content{
border:1px solid rgba(255, 255, 255, 0.1);
background:var(--light-black);
}
body.dark-theme .trade-page .buy-crypto-page .body-wrapper .footer-toolbar .text-wrapper .title{
color:rgba(255, 255, 255, 0.8);
}








body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar{
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button{
background:var(--light-black);
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .page-switch-toolbar .toolbar-button.sell-button{
background:var(--red);
box-shadow: 0 0 6px 3px hsla(358, 84%, 60%, 0.5);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar{
border:1px solid rgba(255, 255, 255, 0.1);
background:var(--light-black);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-logo-wrapper::before{
background:var(--light-black);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .coin-symbol{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .nav-toolbar .select-coin-toolbar .select-coin-button .icon{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .display-wrapper .value-display{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .value{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount .value-display#by-amount-display .name{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .value{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-quantity .value-display#by-quantity-display .name{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .display-wrapper .toggle-display-type{
border:1px solid rgba(255, 255, 255, 0.1);
background:var(--light-black);
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content{
border:1px solid rgba(255, 255, 255, 0.1);
background:var(--light-black);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .footer-toolbar .pay-with-card-content .mercuryo-logo{
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .trade-page .sell-crypto-page .body-wrapper .footer-toolbar .text-wrapper .title{
color:rgba(255, 255, 255, 0.8);
}




@media screen and (min-width: 950px) {
    .trade-page .select-coin-page{
        padding:0 0 0 300px;
    }
    .trade-page .select-coin-page .body-wrapper #data{
        gap:15px;
        justify-content: flex-start;
    }
    .trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
        width: calc(50% - 7.5px);
        border: 1px solid #d1d1d1;
        background: #f5f5f5;
        border-radius: 5px;
        height: 60px;
        padding: 0 15px;
    }

    .trade-page .buy-crypto-page .body-wrapper{
        height: calc(100% - 60px);
        margin: 60px 0 0;
    }
    .trade-page .buy-crypto-page .body-wrapper .nav-toolbar{
        margin: 20px 0 0;
    }
    .trade-page .buy-crypto-page .body-wrapper .footer-toolbar {
        bottom: 20px;
    }
    .trade-page .buy-crypto-page .body-wrapper .display-wrapper.by-amount{
        top: 75px;
        bottom: 116px;
    }

    .trade-page .sell-crypto-page .body-wrapper{
        height: calc(100% - 60px);
        margin: 60px 0 0;
    }
    .trade-page .sell-crypto-page .body-wrapper .nav-toolbar{
        margin: 20px 0 0;
    }
    .trade-page .sell-crypto-page .body-wrapper .footer-toolbar {
        bottom: 20px;
    }
    .trade-page .sell-crypto-page .body-wrapper .display-wrapper.by-amount{
        top: 75px;
        bottom: 116px;
    }
    
    /* DARK MODE */
    body.dark-theme .trade-page .select-coin-page .body-wrapper #data .coin-content-wrapper{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
}
.history-page{
position: fixed;
top: 0;
left: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}
.history-page .all-transactions-history-page {
position: fixed;
top: 0;
left:0;
width: 100%;
height: 100%;
transform: translateX(-100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.history-page .all-transactions-history-page.show{
transform: translateX(0);
}

.history-page .all-transactions-history-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.history-page .all-transactions-history-page .body-wrapper .main-platform{
width: 100%;
margin:20px 0 0;
display: flex;
align-items: center;
justify-content:center;
flex-direction: row;
flex-wrap:wrap;
gap:25px;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .not-found-text{
width: min(500px, 100%);
border: 1px solid #d1d1d1;
background: #f8f8f8;
border-radius: 10px;
padding: 30px 20px;
color: #555;
font-family: sans-serif;
font-weight: 550;
font-size: 14px;
}

.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card{
width:100%;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
padding:0;
margin:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .icon-wrapper{
width:40px;
height:40px;
border: 1px solid var(--blue);
border-radius:50%;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
color:var(--blue);
font-size:15px;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper{
width:calc(100% - 40px);
background: transparent;
display: flex;
align-items: center;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:5px;
padding:0 0 0 15px;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper{
width:100%;
background: transparent;
display: flex;
align-items:flex-start;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:0;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .title-text{
font-family:sans-serif;
font-size:15px;
font-weight:550;
color:#444;
text-align: left;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .date-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
color:#555;
text-align: right;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .value-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
color:#555;
word-break:break-word;
padding:0 10px 0 0;
text-align: left;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .status-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
border-radius:5px;
display: flex;
align-items: center;
justify-content:center;
gap:5px;
font-weight:550;
text-transform: capitalize;
}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .status-text.processed{color:var(--light-green)}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .status-text.pending{color:orange}
.history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .status-text.failed{color:#f44}











.history-page .transaction-details-page{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.history-page .transaction-details-page.show{
transform: translateX(0);
}
.history-page .transaction-details-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.history-page .transaction-details-page .body-wrapper .main-platform{
width:100%;
display:flex;
align-items:center;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:0;
margin:20px 0 0;
background:transparent;
}
.history-page .transaction-details-page .body-wrapper .main-platform .title{
width:100%;
font-family:'fontawesome';
font-size:16px;
color:#555;
font-weight:550;
text-align: center;
letter-spacing:0.5mm;
font-weight:600;
}
.history-page .transaction-details-page .body-wrapper .main-platform .coin-logo{
width:50px;
height:50px;
margin:15px 0 0;
}
.history-page .transaction-details-page .body-wrapper .main-platform .failed-message{
width:min(100% , 450px);
margin:15px 0 0;
background:rgba(255,0,0,0.05);
border:1px solid #f44;
color:#444;
font-family:sans-serif;
font-weight:550;
font-size:14px;
border-radius: 5px;
padding:20px;
}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container{
width:min(100% , 450px);
display:flex;
align-items:center;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:20px;
margin:15px 0 0;
background:#f8f8f8;
border:1px solid #d1d1d1;
border-radius: 5px;
padding:20px;
}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper{
font-family:sans-serif;
font-size:14px;
color:#555;
display:flex;
align-items: center;
justify-content:space-between;
flex-wrap: nowrap;
gap:20px;
width:100%;
}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper .left-text{
font-weight:550;
text-align: left;
}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper .right-text{
font-weight:400;
text-align: right;
word-break: break-word;
max-width:80%;
}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper .right-text .status-text{
font-family:sans-serif;
font-size:14px;
font-weight:400;
border-radius:5px;
display: flex;
align-items: center;
justify-content:flex-end;
gap:5px;
font-weight:550;
text-transform: capitalize;
}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper .right-text .status-text.processed{color:var(--light-green)}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper .right-text .status-text.pending{color:orange}
.history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper .right-text .status-text.failed{color:#f44}

.history-page .transaction-details-page .body-wrapper .main-platform .back-button{
padding: 15px 20px;
background: #f44;
color: rgba(255, 255, 2550.9);
font-family: 'fontawesome';
font-size: 14px;
letter-spacing: 0.4mm;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
border: none;
box-shadow: 0 0 5px 1px rgba(0,0,0,0.1);
border-radius: 5px;
transition: 0.2s;
margin: 20px 0 0;
}
.history-page .transaction-details-page .body-wrapper .main-platform .back-button:hover{
transform:scale(1.05);
}



/* DARK MODE */
body.dark-theme .history-page .all-transactions-history-page .body-wrapper .main-platform  .transaction-content-card .icon-wrapper{
border:1px solid dodgerblue;
color:dodgerblue;
}
body.dark-theme .history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .title-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .date-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .history-page .all-transactions-history-page .body-wrapper .main-platform .transaction-content-card .text-wrapper .inner-text-wrapper .value-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .history-page .all-transactions-history-page .body-wrapper .main-platform .not-found-text{
color:rgba(255, 255, 255, 0.8);
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .history-page .transaction-details-page .body-wrapper .main-platform .title{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .history-page .transaction-details-page .body-wrapper .main-platform .text-container{
background: var(--light-black);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .history-page .transaction-details-page .body-wrapper .main-platform .text-container .text-wrapper{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .history-page .transaction-details-page .body-wrapper .main-platform .failed-message{
color: rgba(255, 255, 255, 0.8);
}


@media screen and (min-width: 950px) {
    .history-page .all-transactions-history-page{
        padding:0 0 0 300px;
    }
    .history-page .transaction-details-page{
        padding:0 0 0 300px;
    }
    .history-page .transaction-details-page .body-wrapper .main-platform{
        margin:30px 0 0;
    }
    .history-page .all-transactions-history-page .body-wrapper .main-platform{
        gap:10px;
    }
    .history-page .all-transactions-history-page .body-wrapper .main-platform  .transaction-content-card{
        width: calc(50% - 5px);
        height: 70px;
        border: 1px solid #d1d1d1;
        border-radius: 5px;
        padding: 0 15px;
        background: #f8f8f8;
    }

    /* DARK MODE */
    body.dark-theme .history-page .all-transactions-history-page .body-wrapper .main-platform  .transaction-content-card{
        border:1px solid rgba(255, 255, 255, 0.1);
        background: var(--light-black);
    }
}.invoice-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.invoice-page.show{
transform: translateX(0);
}

.invoice-page .body-wrapper{
width:min(100% , 500px);
margin: auto;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}


.invoice-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.invoice-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.invoice-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}


.invoice-page .body-wrapper .content-container{
width:100%;
display:flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap:10px;
margin:20px 0 0;
}
.invoice-page .body-wrapper .content-container .content-wrapper {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
background: #f9f9f9;
border: 1px solid #e5e5e5;
border-radius: 7px;
padding:20px 20px 20px 0;
position: relative;
overflow: hidden;
cursor: pointer;
}
.invoice-page .body-wrapper .content-container .content-wrapper .invoice-logo{
width:65px;
display:flex;
align-items: center;
justify-content: center;
font-size:25px;
color:#555;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper{
width:calc(100% - 65px);
display:flex;
align-items: center;
justify-content: center;
flex-direction:column;
flex-wrap:wrap;
gap:0;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .title{
width:100%;
text-align: left;
color:#444;
font-family: sans-serif;
font-size:13px;
font-weight:550;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .description{
width:100%;
text-align: left;
color:#444;
font-family: sans-serif;
font-size:14px;
font-weight:400;
margin:5px 0 0;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap: 10px;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .amount{
text-align: left;
color: #555;
font-family: 'fontawesome';
font-size: 14px;
font-weight: 400;
letter-spacing: 0.4mm;
word-break: break-word;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .status{
text-align: right;
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .status .status-text{
font-family: sans-serif;
font-size: 14px;
font-weight: 400;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
font-weight: 550;
text-transform: uppercase;
padding: 9px 12px;
border-radius: 7px;
color: rgba(255, 255, 255, 0.9);
}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .status .status-text.paid{background:var(--dark-green)}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .status .status-text.pending{background:orange}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .status .status-text.unpaid{background:#f44}
.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .status .status-text.cancelled{background:#f44}

.invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .error-message{
width:100%;
text-align: left;
color:#f55;
font-family: sans-serif;
font-size:13px;
font-weight:400;
margin:5px 0 0;
line-height:18px;
}

.invoice-page .body-wrapper .content-container .not-found-text{
width: 100%;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
background: #f9f9f9;
border: 1px solid #e5e5e5;
border-radius: 7px;
padding:30px;
color:#444;
font-weight:600;
font-size: 17px;
font-family:'fontawesome';
letter-spacing:0.4mm;
}







/* DARK THEME */
body.dark-theme .invoice-page .body-wrapper .heading .text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .invoice-page .body-wrapper .heading .close-button{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .invoice-page .body-wrapper .content-container .content-wrapper{
background: var(--light-black);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .invoice-page .body-wrapper .content-container .content-wrapper .invoice-logo{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .description{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .invoice-page .body-wrapper .content-container .content-wrapper .text-wrapper .amount-and-status-wrapper .amount{
color:rgba(255, 255, 255, 0.8);
}



@media screen and (min-width: 950px) {
    .invoice-page{
        padding:0 0 0 300px;
    }
}.card-payment-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.card-payment-page.show{
transform: translateX(0);
}

.card-payment-page .body-wrapper{
width:min(100% , 500px);
margin: auto;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
}

.card-payment-page  .body-wrapper .card-info-form{
width:100%;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:10px 0 0;
}

.card-payment-page  .body-wrapper .card-info-form .card-flip-container{
width:300px;
height:200px;
margin:auto;
background:transparent;
perspective:1000px;
box-sizing:content-box;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box{
position: relative;
width: 100%;
height: 100%;
transition: all 0.8s cubic-bezier(0.71, 0.03, 0.56, 0.85);
transform-style: preserve-3d;
border-radius: 15px;
box-shadow: 0px 15px 20px 0px rgba(0, 0, 0, 0.3);
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box.flip{
transform: rotateY(180deg);
}


.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .bg-image-ocean {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    overflow: hidden;
    border-radius: 15px;
    filter: brightness(0.6);
    z-index: -1;
}

.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face{
width:100%;
height:100%;
background:transparent;
padding:20px;
position:absolute;
top:0;
left:0;
backface-visibility:hidden;
-webkit-backface-visibility:hidden;
overflow:hidden;
border-radius: 15px;
display:flex;
align-items: center;
justify-content: space-between;
flex-direction: column;
flex-wrap:nowrap;
gap:0;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .active-section-highlight {
    width: 100%;
    height: 100%;
    background: transparent;
    padding: 15px;
    position: absolute;
    top: 0;
    right: 0;
    opacity:0;
    border:1px solid #fff;
    border-radius: 5px;
    transition:all 0.35s cubic-bezier(0.71, 0.03, 0.56, 0.85);
    will-change: transform;
    pointer-events: none;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .active-section-highlight.--card-number {
    width: calc(100% - 20px);
    height: 30px;
    transform: translateY(89px) translateX(-10px);
    opacity: 1;
    background: rgba(0, 0, 0, 0.25);
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .active-section-highlight.--card-holder-name {
    width: calc(100% - 100px);
    height: 45px;
    transform: translateY(143px) translateX(-90px);
    opacity: 1;
    background: rgba(0, 0, 0, 0.2);
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .active-section-highlight.--expiry-date {
    width: 80px;
    height: 45px;
    transform: translateY(143px) translateX(-10px);
    opacity: 1;
    background: rgba(0, 0, 0, 0.2);
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .chip-and-card-logo-container{
width:100%;
display:flex;
align-items: center;
justify-content:space-between;
flex-direction:row;
flex-wrap:wrap;
gap:10px;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .chip-and-card-logo-container .chip-image{
height: 40px;
width: 50px;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .chip-and-card-logo-container .card-logo-wrapper{
height:40px;
width:calc(100% - 60px);
position:relative;
overflow:hidden;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .chip-and-card-logo-container .card-logo-wrapper .card-logo{
max-height: 100%;
max-width: 120px;
transition: all 0.25s ease-in-out 0.1s;
position: absolute;
top: 0;
right: 0;
opacity: 1;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .chip-and-card-logo-container .card-logo-wrapper .card-logo.-fade-in {
    opacity:0;
    transform:translateY(100%);
    transition-delay:0.1s;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .chip-and-card-logo-container .card-logo-wrapper .card-logo.-fade-out {
    opacity:0;
    transform:translateY(-100%);
}



.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display{
display:flex;
align-items:center;
justify-content:space-between;
width:100%;
height:20px;
overflow:hidden;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display .spacer{
width:13px;
height:100%;
display:none;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display.group-into-3 .spacer.group-into-3{
display:block;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display.group-into-3 .number-item:last-child{
display:none;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display.group-into-4 .spacer.group-into-4{
display:block;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display .number-item{
width:15px;
height:100%;
position:relative;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display .number-item .item {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-family: sans-serif;
    font-weight: 400;
    transition: all 0.25s ease-in-out 0.1s;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display .number-item .item.-fade-in {
    opacity:0;
    transform:translateY(100%);
    transition-delay:0.1s;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display .number-item .item.-fade-out {
    opacity:0;
    transform:translateY(-100%);
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .card-number-display .number-item .item .asterisk-icon{
    font-size: 12px;
}


.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper{
display:flex;
align-items:center;
justify-content:space-between;
flex-direction: row;
flex-wrap:wrap;
gap:0;
width:100%;
height:30px;
overflow:hidden;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display{
display:flex;
align-items:flex-start;
justify-content:center;
flex-direction: column;
flex-wrap:nowrap;
gap:0px;
width:calc(100% - 60px);
height:100%;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .title{
width:100%;
font-family: sans-serif;
font-weight:400;
font-size:13px;
color:rgba(255, 255, 255, 0.7);
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper{
width:100%;
font-family: sans-serif;
font-weight:400;
font-size:14px;
color:#fff;
position: relative;
height:20px;
text-transform: uppercase;
word-spacing: -4px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding: 0 10px 0 0;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item{
transition: all 0.25s ease-in-out 0.1s;
display:inline-block;
min-width: 3px;
}

.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-fade-in {
    opacity: 0;
    transform: translateX(100%) rotate(45deg);
    -webkit-transform: translateX(100%) rotate(45deg);
    -moz-transform: translateX(100%) rotate(45deg);
    -ms-transform: translateX(100%) rotate(45deg);
    -o-transform: translateX(100%) rotate(45deg);
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-fade-out{
    opacity:0;
    transform: translateX(-100%) rotate(-45deg);
    -webkit-transform: translateX(-100%) rotate(-45deg);
    -moz-transform: translateX(-100%) rotate(-45deg);
    -ms-transform: translateX(-100%) rotate(-45deg);
    -o-transform: translateX(-100%) rotate(-45deg);
}

.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-default{
position:absolute;
top:0;
left:0;
word-spacing: 0px;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-default.-fade-in{
opacity:0;
transform:translateY(100%);
transition-delay:0.1s;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-default.-fade-out{
opacity:0;
transform:translateY(-100%);
}

.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-first.-fade-in{
opacity:0;
transform:translateY(100%);
transition-delay:0.1s;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .card-name-display .name-wrapper .item.-first.-fade-out{
opacity:0;
transform:translateY(-100%);
}


.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display{
display:flex;
align-items:flex-start;
justify-content:center;
flex-direction: column;
flex-wrap:nowrap;
gap:0px;
width:60px;
height:100%;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .title{
width:100%;
font-family: sans-serif;
font-weight:400;
font-size:13px;
color:rgba(255, 255, 255, 0.7);
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .expiry-date-wrapper{
width:100%;
font-family: sans-serif;
font-weight:400;
font-size:14px;
color:#fff;
position: relative;
height:20px;
overflow: hidden;
word-spacing: -4px;
display:flex;
align-items: center;
justify-content: flex-start;
flex-wrap:wrap;
flex-direction: row;
gap:0;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .expiry-date-wrapper .number-item{
width:25px;
height:100%;
position:relative;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .expiry-date-wrapper .number-item.slash{
width:8px;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .expiry-date-wrapper .number-item .item {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-family: sans-serif;
    font-weight: 400;
    transition: all 0.25s ease-in-out 0.1s;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .expiry-date-wrapper .number-item .item.-fade-in {
    opacity:0;
    transform:translateY(100%);
    transition-delay:0.1s;
}
.card-payment-page  .body-wrapper .card-info-form .card-flip-container .card-flip-box .front-face .name-and-expiry-wrapper .expiry-date-display .expiry-date-wrapper .number-item .item.-fade-out {
    opacity:0;
    transform:translateY(-100%);
}










.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face {
    width: 100%;
    height: 100%;
    background: transparent;
    padding:0;
    position: absolute;
    top: 0;
    left: 0;
    transform: rotateY(180deg);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    overflow: hidden;
    border-radius: 15px;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .dark-band{
    width: 100%;
    height: 40px;
    background:rgba(0,0,19,0.8);
    margin:20px 0 0;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .cvv-display{
    width:100%;
    margin:10px 0 0;
    padding:0 10px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    flex-wrap:wrap;
    gap: 3px;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .cvv-display .title{
    width: 100%;
    text-align: right;
    font-family: sans-serif;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.9);
    font-weight: 400;
    padding: 0 10px 0 0;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .cvv-display .number-item{
    width:100%;
    height: 40px;
    border: none;
    border-radius: 5px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    text-align: right;
    font-family: sans-serif;
    font-size: 9px;
    color: #444;
    font-weight: 400;
    padding: 0 10px;
}

.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .card-logo-wrapper{
height:30px;
width:100%;
margin:20px 0 0;
padding:0 10px;
display: flex;
align-items: center;
justify-content:flex-end;
}
.card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .card-logo-wrapper .card-logo{
height:100%;
}








.card-payment-page .body-wrapper .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:10px;
width:100%;
margin:20px 0 0;
}
.card-payment-page .body-wrapper .input-field-wrapper{
width:100%;
display: flex;
align-items:flex-start;
justify-content: flex-start;
flex-direction:row;
flex-wrap:wrap;
gap:3px 10px;
}
.card-payment-page .body-wrapper .input-field-wrapper .title{
width:100%;
font-family:sans-serif;
font-size:14px;
color:#444;
text-align: left;
font-weight:400;
}
.card-payment-page .body-wrapper .input-field-wrapper .input-field {
    width: 100%;
    height: 40px;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
    font-family: sans-serif;
    font-size: 13px;
    color: #444;
    text-align: left;
    text-indent: 10px;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.card-payment-page .body-wrapper .input-field-wrapper .input-field:focus{
    border:1px solid dodgerblue;
}
.card-payment-page .body-wrapper .input-field-wrapper .input-field.half{
    width:calc(50% - 5px);
}
.card-payment-page .body-wrapper .input-field-wrapper .input-field.error{
    border:1px solid #f44;
}







.card-payment-page .body-wrapper .billing-info-form{
width:100%;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:50px 0 0;
}
.card-payment-page .body-wrapper .billing-info-form .heading {
    width: 100%;
    text-align: center;
    font-family: 'fontawesome';
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.4mm;
    height: 50px;
    padding: 0 20px;
    border: none;
    border-radius: 10px;
    background:#292929;
    color:rgba(255, 255, 255, 0.9);
    display:flex;
    align-items: center;
    justify-content: center;
}





.card-payment-page .body-wrapper .summary-wrapper {
    width:100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px;
    margin: 50px 0 0;
    border: 1px solid #e5e5e5;
    border-radius: 10px;
    background:#f8f8f8;
    padding:25px 0 0;
}
.card-payment-page .body-wrapper .summary-wrapper .text-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:nowrap;
gap:10px;
padding:0 30px;
}
.card-payment-page .body-wrapper .summary-wrapper .text-wrapper .text{
font-size:15px;
font-family: sans-serif;
color:#444;
}
.card-payment-page .body-wrapper .summary-wrapper .text-wrapper .text.left-text{
font-weight:400;
word-break:break-word;
}
.card-payment-page .body-wrapper .summary-wrapper .text-wrapper .text.right-text{
font-weight:550;
}
.card-payment-page .body-wrapper .summary-wrapper .button-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap: wrap;
gap:10px;
margin:10px 0 0;
}
.card-payment-page .body-wrapper .summary-wrapper .button-wrapper .button {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: sans-serif;
    font-size: 14px;
    font-weight:600;
    padding: 0 20px;
    color: rgba(255, 255, 255, 0.9);
    border-radius: 0 0 10px 10px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.card-payment-page .body-wrapper .summary-wrapper .button-wrapper .button.submit-button {
    background: linear-gradient(45deg, var(--dark-green), var(--green));
    border: 1px solid var(--dark-green);
}






.card-payment-page .body-wrapper .button-wrapper{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:row;
    flex-wrap: wrap;
    gap:10px;
    margin:10px 0 0;
    }
.card-payment-page .body-wrapper .button-wrapper .button {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: sans-serif;
    font-size: 14px;
    font-weight:600;
    padding: 0 20px;
    color: rgba(255, 255, 255, 0.9);
    border-radius:10px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.card-payment-page .body-wrapper .button-wrapper .button.cancel-button {
    background:linear-gradient(45deg, var(--red), var(--pink));
    border:1px solid var(--red);
}














/* DARK THEME */
body.dark-theme .card-payment-page .body-wrapper .card-info-form .card-flip-container .card-flip-box .back-face .dark-band {
background: rgba(0, 0, 19, 0.6);
}
body.dark-theme .card-payment-page .body-wrapper .input-field-wrapper .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .card-payment-page .body-wrapper .input-field-wrapper .input-field{
color:rgba(255, 255, 255, 0.9);
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .card-payment-page .body-wrapper .input-field-wrapper .input-field.error{
border:1px solid #f55;
}
body.dark-theme .card-payment-page .body-wrapper .input-field-wrapper .input-field::placeholder{
color:rgba(255, 255, 255, 0.5);
}
body.dark-theme .card-payment-page .body-wrapper .billing-info-form .heading{
background:rgba(255, 255, 255, 0.4);
color:rgba(255, 255, 255, 1);
}
body.dark-theme .card-payment-page .body-wrapper .summary-wrapper{
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .card-payment-page .body-wrapper .summary-wrapper .text-wrapper .text.left-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .card-payment-page .body-wrapper .summary-wrapper .text-wrapper .text.right-text{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .card-payment-page .body-wrapper .summary-wrapper .button-wrapper .button.submit-button{
background: linear-gradient(45deg, var(--green), var(--dark-green));
}

@media screen and (min-width: 950px) {
    .card-payment-page{
        padding:0 0 0 300px;
    }
    .card-payment-page .body-wrapper .card-info-form{
        margin:30px 0 0;
    }
}

@media screen and (min-width: 1400px) {
    .card-payment-page .body-wrapper{
        width: 100%;
        justify-content: space-evenly;
        align-items: center;
        padding: 100px 20px 90px;
    }
    .card-payment-page .body-wrapper .card-info-form{
        width:500px;
        margin:0;
    }
    .card-payment-page .body-wrapper .billing-info-form{
        width:500px;
        margin:0;
        background:#f8f8f8;
        border:1px solid #e9e9e9;
        border-radius:10px;
        padding:30px 25px;
    }
    .card-payment-page .body-wrapper .summary-wrapper{
        width:600px;
        margin:50px calc(calc(100% - 600px) / 2) 0;
    }
    .card-payment-page .body-wrapper .button-wrapper{
        width:600px;
        margin:10px calc(calc(100% - 600px) / 2) 0;
    }

    /* DARK THEME */
    body.dark-theme .card-payment-page .body-wrapper .billing-info-form{
        background:var(--light-black);
        border:1px solid rgba(255, 255, 255, 0.1);
    }
}.crypto-payment-page{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}


.crypto-payment-page .select-coin-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.crypto-payment-page .select-coin-page.show {
transform: translateX(0);
}

.crypto-payment-page .select-coin-page .body-wrapper{
width:min(100% , 500px);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin: auto;
}

.crypto-payment-page .select-coin-page .body-wrapper .heading{
width:100%;
text-align: left;
font-family: 'fontawesome';
font-size:14px;
color:#444;
letter-spacing:0.4mm;
line-height:18px;
margin:30px 0 0;
}
.crypto-payment-page .select-coin-page .body-wrapper .sub-heading-text{
width: 100%;
text-align: left;
font-family: sans-serif;
font-size: 15px;
color: #555;
line-height: 21px;
margin: 5px 0 0;
font-weight: 400;
}
.crypto-payment-page .select-coin-page .body-wrapper .content-wrapper{
width: 100%;
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-direction: row;
flex-wrap: wrap;
gap: 10px;
margin: 20px 0 0;
}
.crypto-payment-page .select-coin-page .body-wrapper .content-wrapper .coin-button{
width:100%;
height:70px;
display:flex;
align-items: center;
justify-content:flex-start;
flex-direction: row;
flex-wrap:wrap;
gap:10px;
padding:0 15px 0;
background:#f5f5f5;
border:1px solid #e5e5e5;
border-radius: 5px;
transition: 0.2s;
position: relative;
overflow: hidden;
cursor: pointer;
}
.crypto-payment-page .select-coin-page .body-wrapper .content-wrapper .coin-button .coin-logo{
width:40px;
height:40px;
}
.crypto-payment-page .select-coin-page .body-wrapper .content-wrapper .coin-button .text{
color:#333;
font-family: sans-serif;
font-weight:400;
font-size:14px;
line-height:18px;
}
.crypto-payment-page .select-coin-page .body-wrapper .content-wrapper .coin-button .text .bold{
font-weight:600;
}
.crypto-payment-page .select-coin-page .body-wrapper .back-button{
height:50px;
padding:0 25px;
border:none;
border-radius:7px;
background:#f44;
color:rgba(255,255,255,0.9);
font-size:15px;
display:flex;
align-items:center;
justify-content:center;
gap:5px;
margin:20px 0 0;
position: relative;
overflow: hidden;
cursor: pointer;
}
































.crypto-payment-page .make-payment-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.crypto-payment-page .make-payment-page.show {
transform: translateX(0);
}

.crypto-payment-page .make-payment-page .body-wrapper{
width:min(100% , 500px);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin: auto;
}
.crypto-payment-page .make-payment-page .body-wrapper .heading{
width:100%;
text-align: left;
font-family: 'fontawesome';
font-size:14px;
color:#444;
letter-spacing:0.4mm;
line-height:18px;
margin:30px 0 0;
}

.crypto-payment-page .make-payment-page .body-wrapper .top-nav{
width: 100%;
height: 70px;
background:#f5f5f5;
border: 1px solid #e5e5e5;
margin:20px 0 0;
border-radius:10px;
display:flex;
align-items: center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
padding:0 15px;
}
.crypto-payment-page .make-payment-page .body-wrapper .top-nav .coin-logo{
width: 40px;
height: 40px;
}
.crypto-payment-page .make-payment-page .body-wrapper .top-nav .text-1{
width:calc(100% - 60px);
height: 70px;
display: flex;
align-items: center;
justify-content: center;
color:#444;
font-family:'fontawesome';
letter-spacing: 0.4mm;
font-size: 12px;
padding:0 20px 0 0;
}
.crypto-payment-page .make-payment-page .body-wrapper .top-nav .spinning-icon{
width: 20px;
height: 20px;
display:flex;
align-items: center;
justify-content: center;
color: var(--green);
font-size:20px;
}
.crypto-payment-page .make-payment-page .body-wrapper .info-text-1{
font-family:sans-serif;
font-size: 14px;
width: 100%;
color:#555;
line-height: 22px;
margin:20px 0 0;
}
.crypto-payment-page .make-payment-page .body-wrapper .info-text-1 font{
font-weight: 600;
}
.crypto-payment-page .make-payment-page .body-wrapper .qr-code-wrapper-show{
width:100%;
height: 200px;
margin: 20px 0 0;
transition: 0.5s;
display: flex;
align-items: center;
justify-content: center;
}
.crypto-payment-page .make-payment-page .body-wrapper .qr-code-wrapper-hide{
width:100%;
height: 0;
margin:0;
border-top:none;
border-bottom:none;
padding:0;
overflow: hidden;
transition: 0.5s;
display: flex;
align-items: center;
justify-content: center;
}
.crypto-payment-page .make-payment-page .body-wrapper .qr-code{
width: 200px;
height: 200px;
border: 1px solid #d1d1d1;
padding: 5px;
border-radius: 5px;
}


.crypto-payment-page .make-payment-page .body-wrapper .text-display-container{
width:100%;
display: flex;
align-items:center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin: 20px auto 0;
}
.crypto-payment-page .make-payment-page .body-wrapper .text-display-container .text-display-wrapper{
width:100%;
display: flex;
align-items:center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
padding:15px 20px;
border-radius: 10px;
background:#f5f5f5;
border:1px solid #e5e5e5;
overflow:hidden;
}
.crypto-payment-page .make-payment-page .body-wrapper .text-display-container .text-display-wrapper .text-wrapper{
width: calc(100% - 40px);
display: flex;
align-items:center;
justify-content:flex-start;
flex-direction:row;
flex-wrap:wrap;
gap:5px;
}
.crypto-payment-page .make-payment-page .body-wrapper .text-display-container .text-display-wrapper .text-wrapper .title{
color: #555;
font-family: 'fontawesome';
letter-spacing: 0.4mm;
width: 100%;
text-align: left;
font-size: 9px;
font-weight: 600;
}
.crypto-payment-page .make-payment-page .body-wrapper .text-display-container .text-display-wrapper .text-wrapper .main-text{
width:100%;
color:#444;
font-family: sans-serif;
font-size: 20px;
word-break:break-word;
}
.crypto-payment-page .make-payment-page .body-wrapper .text-display-container .text-display-wrapper .copy-button{
width: 40px;
height: 40px;
color: royalblue;
font-size: 17px;
display: flex;
align-items: center;
justify-content: center;
background: transparent;
border-radius: 5px;
border:none;
transition: 0.2s;
}
.crypto-payment-page .make-payment-page .body-wrapper .text-display-container .text-display-wrapper .copy-button:hover{
transform: scale(1.05);
}
.crypto-payment-page .make-payment-page .body-wrapper .info-text-2{
font-family:sans-serif;
font-size: 14px;
width: 100%;
color:#555;
line-height: 22px;
margin: 20px 0 0px;
text-align: center;
}
.crypto-payment-page .make-payment-page .body-wrapper .button-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content: flex-start;
flex-direction:column;
flex-wrap:wrap;
gap:15px;
margin:20px 0 0;
}
.crypto-payment-page .make-payment-page .body-wrapper .button-wrapper .button{
height: 50px;
border:none;
font-family: 'fontawesome';
letter-spacing: 0.4mm;
font-size: 13px;
display: block;
color:white;
border-radius:10px;
padding:0 25px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.crypto-payment-page .make-payment-page .body-wrapper .button-wrapper .button .icon{
margin-left:5px;
}
.crypto-payment-page .make-payment-page .body-wrapper .button-wrapper .button.qr-code-button{
width:50px;
border-radius:50%;
background:var(--light-black);
padding:0;
}
.crypto-payment-page .make-payment-page .body-wrapper .button-wrapper .button.paid-button{
background:var(--green);
}
.crypto-payment-page .make-payment-page .body-wrapper .button-wrapper .button.cancel-button{
background:#f55;
}











/* DARK THEME */
body.dark-theme .crypto-payment-page .select-coin-page .body-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .crypto-payment-page .select-coin-page .body-wrapper .sub-heading-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .crypto-payment-page .select-coin-page .body-wrapper .content-wrapper .coin-button{
background: var(--light-black);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .crypto-payment-page .select-coin-page .body-wrapper .content-wrapper .coin-button .text{
color:rgba(255, 255, 255, 0.8);
}

body.dark-theme .crypto-payment-page .make-payment-page .heading{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .crypto-payment-page .make-payment-page .top-nav{
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .crypto-payment-page .make-payment-page .top-nav .text-1{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .crypto-payment-page .make-payment-page .info-text-1{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .crypto-payment-page .make-payment-page .qr-code{
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .crypto-payment-page .make-payment-page .text-display-container .text-display-wrapper{
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .crypto-payment-page .make-payment-page .text-display-container .text-display-wrapper .text-wrapper .title{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .crypto-payment-page .make-payment-page .text-display-container .text-display-wrapper .text-wrapper .main-text{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .crypto-payment-page .make-payment-page .info-text-2{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .crypto-payment-page .make-payment-page .button-wrapper .button.qr-code-button{
background:rgba(0, 0, 0, 0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}

@media screen and (min-width: 950px) {
    
    .crypto-payment-page .select-coin-page{
        padding:0 0 0 300px;
    }
    .crypto-payment-page .make-payment-page{
        padding:0 0 0 300px;
    }
}.settings-page{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 0;
z-index: 0;
padding:0;
margin:0;
}
.settings-page .main-page {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(-100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}

.settings-page .main-page.show {
transform: translateX(0);
}

.settings-page .main-page .body-wrapper{
width:100%;
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}

.settings-page .main-page .body-wrapper  .profile-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:center;
margin:10px 0 0;
}
.settings-page .main-page .body-wrapper .profile-wrapper .content-wrapper {
width: min(500px, 100%);
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
gap: 17px;
background: #f8f8f8;
border: 1px solid #e5e5e5;
border-radius: 30px;
padding: 40px 20px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .main-page .body-wrapper  .profile-wrapper .content-wrapper .image{
width: 100px;
}
.settings-page .main-page .body-wrapper  .profile-wrapper .content-wrapper .image.coloured{display:block}
.settings-page .main-page .body-wrapper  .profile-wrapper .content-wrapper .image.white{display:none}

.settings-page .main-page .body-wrapper  .profile-wrapper .content-wrapper .text{
width: 100%;
text-align: center;
font-size: 14px;
font-family: 'fontawesome';
font-weight: 600;
color: #666;
letter-spacing: 0.5mm;
word-break: break-word;
}

.settings-page .main-page .body-wrapper .button-link-wrapper{
width:100%;
display:flex;
align-items:center;
justify-content:flex-start;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:10px 0 0;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link{
width:100%;
height:50px;
background:transparent;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap:wrap;
gap:0;
padding:0;
margin:0;
border:none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper{
background:transparent;
display:flex;
align-items:center;
justify-content:flex-start;
padding:0;
margin:0;
gap:15px;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper .icon{
background:transparent;
display:flex;
align-items:center;
justify-content:center;
color:#444;
font-size:20px;
width: 25px;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper .img-icon{
width: 25px;
filter: brightness(0);
opacity:0.7;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper .text{
color:#444;
font-size:18px;
font-family: sans-serif;
font-weight:400;
}

.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .number-display{
color: rgba(255, 255, 255, 0.9);
font-size: 11px;
font-family: sans-serif;
font-weight: 400;
padding: 0 10px;
height: 20px;
background: var(--dark-green);
align-items: center;
justify-content: center;
text-align: center;
border-radius: 15px;
display: none;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .number-display.show{
display:flex;
}

.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-display{
color:#444;
font-size:18px;
font-family: sans-serif;
font-weight:400;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .status-wrapper .status-text {
color: rgba(255, 255, 255, 0.9);
font-size: 12px;
font-family: sans-serif;
font-weight: 400;
padding: 0 10px;
border: none;
border-radius: 5px;
height:25px;
display:flex;
align-items: center;
justify-content: center;
gap:5px;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .status-wrapper .status-text.verified{background:var(--dark-green)}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .status-wrapper .status-text.pending{background:orange}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .status-wrapper .status-text.not-verified{background:#f44}

.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch {
position: relative;
display:block;
width: 50px;
height: 25px;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch input{ 
opacity: 0;
width: 0;
height: 0;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch .slider{
position: absolute;
cursor:pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch .slider:before {
position: absolute;
content: "";
height: 20px;
width: 20px;
left: 3px;
top: 2.5px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch input:checked + .slider {
background-color: #4CBB17;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch input:focus + .slider {
box-shadow: 0 0 1px #4CBB17;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(24px);
}
/* Rounded sliders */
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch .slider.round {
border-radius: 30px;
}
.settings-page .main-page .body-wrapper .button-link-wrapper .button-link .toggle-switch .slider.round:before {
border-radius: 50%;
}


















.settings-page .currency-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .currency-page.show{
transform: translateX(0);
}

.settings-page .currency-page .body-wrapper{
width:min(100% , 500px);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}
.settings-page .currency-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.settings-page .currency-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.settings-page .currency-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}

.settings-page .currency-page .body-wrapper .search-field-wrapper{
width:100%;
height:35px;
border: 1px solid #f1f1f1;
background: #f8f8f8;
border-radius:10px;
display:flex;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap:wrap;
gap:0;
overflow:hidden;
margin:15px 0 0;
}
.settings-page .currency-page .body-wrapper .search-field-wrapper .back-button{
width:40px;
height:calc(100% - 10px);
border:none;
border-right: 1px solid #f1f1f1;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
font-size:10px;
color:#666;
}
.settings-page .currency-page .body-wrapper .search-field-wrapper .search-field{
width:calc(100% - 80px);
height:100%;
border:none;
background:transparent;
font-size:14px;
color:#444;
text-indent: 15px;
padding: 0;
}
.settings-page .currency-page .body-wrapper .search-field-wrapper .clear-button-wrapper{
width:40px;
height:100%;
border:none;
background:transparent;
display:flex;
align-items: center;
justify-content: center;
}
.settings-page .currency-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
width:100%;
height:100%;
border: none;
background: transparent;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
color: var(--dark-blue);
position: relative;
overflow: hidden;
cursor: pointer;
padding:0;
}
.settings-page .currency-page .body-wrapper #data{
width:100%;
display:flex;
align-items:center;
justify-content:flex-start;
flex-direction:row;
flex-wrap: wrap;
gap:15px;
margin:15px 0 0;
}
.settings-page .currency-page .body-wrapper #data .currency-button {
width: calc(50% - 7.5px);
height: 50px;
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: row;
flex-wrap: wrap;
gap: 10px;
border: 1px solid #e9e9e9;
background:linear-gradient(45deg, #f8f8f8, #e9e9e9);
border-radius: 7px;
padding:0 20px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .currency-page .body-wrapper #data .currency-button .currency{
color:#444;
font-family:sans-serif;
font-size:15px;
letter-spacing:0.1mm;
font-weight:400;
}
.settings-page .currency-page .body-wrapper #data .currency-button .symbol{
color:#555;
font-family:sans-serif;
font-size:15px;
letter-spacing:0.1mm;
font-weight:600;
}

.settings-page .currency-page .body-wrapper #data .not-found-text{
width: 100%;
font-family: sans-serif;
font-size: 15px;
color: #555;
font-weight: 400;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 15px;
margin:30px auto 0;
}
.settings-page .currency-page .body-wrapper #data .not-found-text .icon{
color: var(--light-blue);
font-size: 50px;
}
.settings-page .currency-page .body-wrapper #data .not-found-text .text{
color:#444;
font-family:sans-serif;
font-size:16px;
}





















.settings-page .kyc-verification-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .kyc-verification-page.show{
transform: translateX(0);
}

.settings-page .kyc-verification-page .body-wrapper{
width:min(100% , 500px);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}
.settings-page .kyc-verification-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.settings-page .kyc-verification-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.settings-page .kyc-verification-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}


.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper{
width: min(100%, 500px);
height: 80px;
display: none;
align-items: center;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
margin: 30px auto 0;
background: #f8f8f8;
border: 1px solid #f1f1f1;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper.show{
display:flex;
}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .left-text{
width:50%;
height:calc(100% - 20px);
display:flex;
align-items: center;
justify-content: center;
font-family:'fontawesome';
font-size:13px;
color:#444;
letter-spacing: 0.4mm;
border-right: 1px solid #e5e5e5;
}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .right-text{
width:50%;
height:100%;
display:flex;
align-items: center;
justify-content: center;
}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .right-text .status-text{
padding: 10px 15px;
border-radius: 10px;
color: white;
font-size: 13px;
font-family: var(--default-font);
line-height: 17px;
display: inline-block;
font-weight: 600;
}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .right-text .status-text.pending{background:orange;}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .right-text .status-text.verified{background:var(--green);}
.settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .right-text .status-text.not-verified{background:#f44;}



.settings-page .kyc-verification-page .body-wrapper .kyc-failed-message{
width:min(100% , 500px);
padding:30px 20px;
display:none;
text-align:left;
font-family: sans-serif;
color:#f44;
font-size: 15px;
line-height:20px;
gap:0;
margin:20px auto 0;
background:rgba(255, 0, 0, 0.1);
border:1px solid rgba(255, 0, 0, 0.5);
border-radius: 10px;
overflow: hidden;
box-shadow:0 0 5px 1px rgba(0,0,0,0.1);
}
.settings-page .kyc-verification-page .body-wrapper .kyc-failed-message.show{
display:flex;
}



.settings-page .kyc-verification-page .body-wrapper .form-wrapper{
width:min(500px , 100%);
display:none;
align-items:center;
justify-content: center;
flex-direction:row;
flex-wrap:wrap;
margin:20px auto 0;
background:#f8f8f8;
border: 1px solid #e5e5e5;
border-radius:8px;
padding:30px 20px;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper.show{
display:flex;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:10px;
width:100%;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper{
height:60px;
width:100%;
background: transparent;
border: none;
border: 1px solid #d1d1d1;
border-radius:10px;
position:relative;
overflow:hidden;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper.small{
width:calc(50% - 7.5px);
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .icon{
width:50px;
height: 100%;
position:absolute;
top:0;
left:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
cursor:text;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .placeholder-text{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: flex-start;
font-family:sans-serif;
transition:.2s;
cursor:text;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper.password .placeholder-text{
width:calc(100% - 100px);
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#444;
font-size:14px;
border: none;
z-index: 1;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper.password .input-field{
width:calc(100% - 100px);
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field:focus~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field:valid~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .toggle-password-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:none;
align-items: center;
justify-content: center;
cursor: pointer;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper.password .toggle-password-button{
display:flex;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-closed-icon{
display:block;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-open-icon{
display:none;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-open-icon{
display:block;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-closed-icon{
display:none;
}

.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .error-text-wrapper{
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap:wrap;
padding:10px 15px;
border:1px solid #d1d1d1;
background:#f9f9f9;
border-radius: 5px;
margin:-5px 0 0;
width:100%;
gap:5px;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .error-text-wrapper.show{
display:flex;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .error-text-wrapper .error-text{
font-family: var(--default-font);
font-size: 11px;
color: #f55;
font-weight: 500;
width: 100%;
line-height: 14px;
display: none;
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
gap: 10px
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .error-text-wrapper .error-text.show{
display:flex;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .submit-button{
height:50px;
padding:0 40px;
border:none;
border-radius:5px;
font-family:'fontawesome';
font-size: 14px;
letter-spacing:0.5mm;
margin:30px 0 0;
display: flex;
align-items: center;
justify-content:center;
background:var(--green);
color:white;
gap:5px;
position: relative;
overflow: hidden;
cursor: pointer;
}


.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label{
width:100%;
height:150px;
margin:0 auto;
border:1px solid #e5e5e5;
background:#f5f5f5;
border-radius:10px;
display:flex;
align-items:center;
justify-content: center;
transition:0.2s;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label .select-picture-wrapper {
width: 100%;
height:100%;
color:#444;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label .select-picture-wrapper .icon{
margin:15px 0;
font-size:30px;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label .select-picture-wrapper .text{
font-family:'fontawesome';
font-size:13px;
letter-spacing:0.5mm;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label .id-img{
max-width:calc(100% - 20px);
max-height:calc(100% - 20px);
display:none;
}

.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label.error{
border:1px solid #f44 !important;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label.show-image .select-picture-wrapper {
display:none;
}
.settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label.show-image .id-img {
display:block;
}




















.settings-page .linked-wallets-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .linked-wallets-page.show{
transform: translateX(0);
}

.settings-page .linked-wallets-page .body-wrapper{
width:min(100% , 500px);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}
.settings-page .linked-wallets-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.settings-page .linked-wallets-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.settings-page .linked-wallets-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .linked-wallets-page .body-wrapper #data{
width:100%;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap: wrap;
gap:15px;
margin:20px 0 0;
}
.settings-page .linked-wallets-page .body-wrapper #data .content-wrapper{
width:100%;
border:1px solid #e5e5e5;
border-radius:10px;
background: #f5f5f5;
overflow: hidden;
}
.settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .top-content{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
flex-direction:row;
flex-wrap: wrap;
gap:0;
padding:20px;
border-bottom:1px solid #e5e5e5;
}
.settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .top-content .img-logo{
width:25px;
}
.settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .top-content .title{
width:calc(100% - 25px - 25px);
text-align:center;
color:#555;
font-family:sans-serif;
font-size:15px;
font-weight:550;
}
.settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .top-content .tick-icon{
width:25px;
display:flex;
align-items:center;
justify-content: center;
color:var(--green);
}
.settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .bottom-content{
width:100%;
text-align:left;
color:#555;
font-family:sans-serif;
font-size:15px;
font-weight:400;
padding:20px;
text-transform: capitalize;
}
.settings-page .linked-wallets-page .body-wrapper #data .not-found-text{
width:100%;
border:1px solid #e5e5e5;
border-radius:10px;
background: #f5f5f5;
padding:30px 20px;
font-family: sans-serif;
font-size:15px;
color:#555;
font-weight:400;
}

.settings-page .linked-wallets-page .body-wrapper .connect-button{
width:min(100% , 300px);
height:50px;
padding:0 20px;
border-radius:5px;
border: none;
background:var(--green);
color:rgba(255,255,255,0.9);
font-weight:550;
font-size:15px;
font-family: sans-serif;
box-shadow:0 0 5px 1px rgba(0,0,0,0.2);
display: flex;
align-items: center;
justify-content:center;
gap:10px;
border:none;
margin:15px auto 0;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .linked-wallets-page .body-wrapper .connect-button .logo{
height:20px;
filter: brightness(0) contrast(1) invert(1);
}









.settings-page .change-email-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .change-email-page.show{
transform: translateX(0);
}

.settings-page .change-email-page .body-wrapper{
width:min(500px , 100%);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}
.settings-page .change-email-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.settings-page .change-email-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.settings-page .change-email-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}

.settings-page .change-email-page .body-wrapper .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:0 15px;
width:100%;
margin:15px 0 0;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper{
height:60px;
width:100%;
background: transparent;
border: 1px solid #d1d1d1;
border-radius:5px;
position:relative;
overflow:hidden;
margin:15px 0 0;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .icon{
width:50px;
height: 100%;
position:absolute;
top:0;
left:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
cursor:text;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .placeholder-text{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: flex-start;
font-family:sans-serif;
transition:.2s;
cursor:text;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper.password .placeholder-text{
width:calc(100% - 100px);
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#444;
font-size:14px;
border: none;
z-index: 1;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper.password .input-field{
width:calc(100% - 100px);
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field:focus~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field:valid~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .toggle-password-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:none;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper.password .toggle-password-button{
display:flex;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-closed-icon{
display:block;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-open-icon{
display:none;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-open-icon{
display:block;
}
.settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-closed-icon{
display:none;
}

.settings-page .change-email-page .body-wrapper .error-text-wrapper{
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
padding: 10px 15px;
border-radius: 5px;
margin: 10px 0 0;
width: 100%;
background: #f8f8f8;
gap: 5px;
border: 1px solid #d1d1d1;
}
.settings-page .change-email-page .body-wrapper .error-text-wrapper.show{
display:flex;
}
.settings-page .change-email-page .body-wrapper .error-text-wrapper .error-text{
font-family: var(--default-font);
font-size: 11px;
color: #f55;
font-weight: 500;
width: 100%;
line-height: 14px;
display: none;
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
gap: 10px
}
.settings-page .change-email-page .body-wrapper .error-text-wrapper .error-text.show{
display:flex;
}
.settings-page .change-email-page .body-wrapper .submit-button{
height:50px;
padding:0 30px;
border:none;
border-radius:5px;
font-family:'fontawesome';
font-size: 14px;
letter-spacing:0.5mm;
margin:15px auto 0;
display: flex;
align-items: center;
justify-content:center;
background:var(--dark-green);
color:white;
gap:5px;
position: relative;
overflow: hidden;
cursor: pointer;
}










.settings-page .change-password-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .change-password-page.show{
transform: translateX(0);
}

.settings-page .change-password-page .body-wrapper{
width:min(500px , 100%);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}
.settings-page .change-password-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.settings-page .change-password-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.settings-page .change-password-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}

.settings-page .change-password-page .body-wrapper .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:0 15px;
width:100%;
margin:15px 0 0;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper{
height:60px;
width:100%;
background: transparent;
border: 1px solid #d1d1d1;
border-radius:5px;
position:relative;
overflow:hidden;
margin:15px 0 0;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .icon{
width:50px;
height: 100%;
position:absolute;
top:0;
left:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
cursor:text;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .placeholder-text{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: flex-start;
font-family:sans-serif;
transition:.2s;
cursor:text;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper.password .placeholder-text{
width:calc(100% - 100px);
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#444;
font-size:14px;
border: none;
z-index: 1;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper.password .input-field{
width:calc(100% - 100px);
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field:focus~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field:valid~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .toggle-password-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:none;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper.password .toggle-password-button{
display:flex;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-closed-icon{
display:block;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-open-icon{
display:none;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-open-icon{
display:block;
}
.settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-closed-icon{
display:none;
}

.settings-page .change-password-page .body-wrapper .error-text-wrapper{
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
padding: 10px 15px;
border-radius: 5px;
margin: 10px 0 0;
width: 100%;
background: #f8f8f8;
gap: 5px;
border: 1px solid #d1d1d1;
}
.settings-page .change-password-page .body-wrapper .error-text-wrapper.show{
display:flex;
}
.settings-page .change-password-page .body-wrapper .error-text-wrapper .error-text{
font-family: var(--default-font);
font-size: 11px;
color: #f55;
font-weight: 500;
width: 100%;
line-height: 14px;
display: none;
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
gap: 10px
}
.settings-page .change-password-page .body-wrapper .error-text-wrapper .error-text.show{
display:flex;
}
.settings-page .change-password-page .body-wrapper .submit-button{
height:50px;
padding:0 30px;
border:none;
border-radius:5px;
font-family:'fontawesome';
font-size: 14px;
letter-spacing:0.5mm;
margin:15px auto 0;
display: flex;
align-items: center;
justify-content:center;
background:var(--dark-green);
color:white;
gap:5px;
position: relative;
overflow: hidden;
cursor: pointer;
}













.settings-page .referral-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .referral-page.show{
transform: translateX(0);
}

.settings-page .referral-page .body-wrapper{
width:min(500px , 100%);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:15px;
margin:auto;
}
.settings-page .referral-page .body-wrapper .heading{
width:100%;
font-family:sans-serif;
font-size: 25px;
font-weight:700;
color:#444;
margin:20px 0 0;
}
.settings-page .referral-page .body-wrapper .heading font{
color:dodgerblue;
font-family: inherit;
}
.settings-page .referral-page .body-wrapper .sub-text{
width:100%;
font-family:sans-serif;
font-size: 18px;
font-weight:400;
line-height: 22px;
color:#555;
}
.settings-page .referral-page .body-wrapper .referral-link-wrapper{
width:100%;
border-radius: 5px;
overflow: hidden;
background:transparent;
display:flex;
align-items: center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
padding:15px 0 15px 20px;
border:1px solid #d1d1d1;
background:#f7f7f7;
}
.settings-page .referral-page .body-wrapper .referral-link-wrapper .text-wrapper{
width:calc(100% - 50px);
display: flex;
align-items:center;
justify-content:flex-start;
flex-direction: row;
flex-wrap:wrap;
gap:3px;
}
.settings-page .referral-page .body-wrapper .referral-link-wrapper .text-wrapper .title{
width:100%;
font-family:sans-serif;
font-size: 14px;
font-weight:400;
color:#444;
}
.settings-page .referral-page .body-wrapper .referral-link-wrapper .text-wrapper .link-text{
width:100%;
font-family:sans-serif;
font-size: 15px;
font-weight:400;
color:#555;
word-break: break-all;
}
.settings-page .referral-page .body-wrapper .referral-link-wrapper .copy-button{
display: flex;
align-items: center;
justify-content: center;
height:100%;
width: 50px;
color:dodgerblue;
font-size: 14px;
border: none;
background: transparent;
position: relative;
overflow: hidden;
cursor: pointer;
}
.settings-page .referral-page .body-wrapper .close-button{
height:45px;
padding:0 20px;
border:none;
background:#f55;
border-radius:5px;
color:rgba(255, 255, 255, 0.9);
font-family: sans-serif;
font-size:14px;
position: relative;
overflow: hidden;
cursor: pointer;
}







.settings-page .customer-support-page{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
scroll-behavior: smooth;
}
.settings-page .customer-support-page.show{
transform: translateX(0);
}

.settings-page .customer-support-page .body-wrapper{
width:min(500px , 100%);
padding:60px 20px 100px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
gap:0;
margin:auto;
}
.settings-page .customer-support-page .body-wrapper .heading{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
margin:20px 0 0;
}
.settings-page .customer-support-page .body-wrapper .heading .text{
width:calc(100% - 20px);
text-align:center;
padding:0 20px 0 0;
color:#444;
font-weight:400;
font-family:'fontawesome';
font-size:14px;
letter-spacing: 0.5mm;
}
.settings-page .customer-support-page .body-wrapper .heading .close-button{
width:20px;
display:flex;
align-items:center;
justify-content: center;
color:#444;
font-weight:800;
font-size:17px;
background:transparent;
border: none;
padding:0;
margin:0;
font-family: sans-serif;
position: relative;
overflow: hidden;
cursor: pointer;
}

.settings-page .customer-support-page .body-wrapper #data{
margin:10px 0 0;
width:100%;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper{
width:100%;
border-radius: 10px;
box-shadow:0 0 5px 1px rgba(0,0,0,0.1);
overflow: hidden;
display:flex;
align-items: center;
justify-content: space-between;
flex-direction:row;
flex-wrap:wrap;
padding:10px 15px 10px 0;
margin: 10px 0 0;
border: none;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper.live-support{
background:var(--blue);
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper.whatsapp{
background:#075E54;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper.telegram{
background:var(--light-blue);
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper.instagram{
background:linear-gradient(45deg, #f9ce34, #ee2a7b, #6228d7);
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper.email{
background:#EE4D2D;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper .icon{
height:50px;
width:50px;
display: flex;
align-items: center;
justify-content: center;
color:rgba(255,255,255,0.9);
border-right: 0.15mm solid #d1d1d1;
font-size:30px;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper .text-wrapper{
width: calc(100% - 80px);
display: flex;
align-items:flex-start;
justify-content:center;
flex-direction: column;
flex-wrap:nowrap;
gap: 5px;
padding:0px 10px;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper .text-wrapper .title{
font-size:11px;
color:rgba(255,255,255,0.9);
font-family: sans-serif;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper .text-wrapper .text{
font-size: 15px;
color: rgba(255,255,255,0.9);
font-family:var(--default-font);
word-break: break-word;
font-weight: 600;
line-height: 15px;
}
.settings-page .customer-support-page .body-wrapper #data .customer-support-details-wrapper .open-link-button{
display: flex;
align-items: center;
justify-content: center;
height: 30px;
width: 30px;
border-radius: 5px;
color:rgba(255,255,255,0.9);
font-size: 14px;
background: transparent;
border: 1px solid #d1d1d1;
box-shadow: 0 0 5px 1px rgba(0,0,0,0.1);
position: relative;
overflow: hidden;
cursor: pointer;
}

.settings-page .customer-support-page .body-wrapper #data .not-found-text{
width:100%;
padding:20px;
border-radius:10px;
background:#e5e5e5;
border:1px solid #d1d1d1;
color:#444;
font-family:system-ui,sans-serif;
font-size:16px;
line-height:22px;
text-align: center;
margin:15px 0 0;
font-weight:600;
}



















/* DARK MODE */
body.dark-theme .settings-page .main-page .body-wrapper .profile-wrapper .content-wrapper{
background:linear-gradient(45deg, var(--light-black), rgb(86 95 132 / 80%));
border: 1px solid rgba(255, 255, 255, 0);
}
body.dark-theme .settings-page .main-page .body-wrapper  .profile-wrapper .content-wrapper .image.coloured{display:none}
body.dark-theme .settings-page .main-page .body-wrapper  .profile-wrapper .content-wrapper .image.white{display:block}
body.dark-theme .settings-page .main-page .body-wrapper .profile-wrapper .content-wrapper .text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper .icon{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper .text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-wrapper .img-icon {
filter: brightness(0) contrast(1) invert(1);
}
body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link .number-display{
background:var(--light-green);
}
body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link .text-display{
color:rgba(255, 255, 255, 0.7);
}

body.dark-theme .settings-page .currency-page .body-wrapper .heading .close-button{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .currency-page .body-wrapper .heading .text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .currency-page .body-wrapper .search-field-wrapper{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .currency-page .body-wrapper .search-field-wrapper .back-button{
color: rgba(255, 255, 255, 0.9);
border-right:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .currency-page .body-wrapper .search-field-wrapper .search-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .settings-page .currency-page .body-wrapper .search-field-wrapper .clear-button-wrapper .clear-button{
color:var(--light-blue)
}
body.dark-theme .settings-page .currency-page .body-wrapper #data .currency-button{
background: var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .currency-page .body-wrapper #data .currency-button .currency{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .currency-page .body-wrapper #data .currency-button .symbol{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .currency-page .body-wrapper #data .not-found-text .text{
color: rgba(255, 255, 255, 0.9);
}



body.dark-theme .settings-page .kyc-verification-page .body-wrapper .heading .close-button{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .heading .text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper{
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .main-platform-wrapper .left-text{
color: rgba(255, 255, 255, 0.9);
border-right:1px solid rgba(255, 255, 255, 0.1);
}

body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper{
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .heading{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .sub-heading-text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label{
background:rgba(0, 0, 0, 0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .select-picture-label .select-picture-wrapper{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper{
background:rgba(0, 0, 0, 0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .icon{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .placeholder-text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field{
color: rgba(255, 255, 255, 0.9);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .input-field-wrapper .input-field option{
color: rgba(255, 255, 255, 0.9);
background:var(--light-black);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .kyc-verification-page .body-wrapper .form-wrapper .input-field-wrapper-container .error-text-wrapper{
background:rgba(0, 0, 0, 0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .settings-page .linked-wallets-page .body-wrapper .heading .close-button{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .linked-wallets-page .body-wrapper .heading .text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .linked-wallets-page .body-wrapper #data .content-wrapper{
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .top-content{
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .top-content .title{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .linked-wallets-page .body-wrapper #data .content-wrapper .bottom-content{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .linked-wallets-page .body-wrapper #data .not-found-text{
color: rgba(255, 255, 255, 0.7);
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
}

body.dark-theme .settings-page .change-email-page .body-wrapper .heading .close-button{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .change-email-page .body-wrapper .heading .text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .change-email-page .body-wrapper .input-field-wrapper{
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .change-email-page .body-wrapper .input-field-wrapper .icon{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-email-page .body-wrapper .input-field-wrapper .placeholder-text{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-email-page .body-wrapper .input-field-wrapper .input-field{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-email-page .body-wrapper .error-text-wrapper{
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
}


body.dark-theme .settings-page .change-password-page .body-wrapper .heading .close-button{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .heading .text{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .input-field-wrapper{
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .input-field-wrapper .icon{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .input-field-wrapper .placeholder-text{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .input-field-wrapper .input-field{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .input-field-wrapper .toggle-password-button{
color: rgba(255, 255, 255, 0.7);
}
body.dark-theme .settings-page .change-password-page .body-wrapper .error-text-wrapper{
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
}

body.dark-theme .settings-page .referral-page .body-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .settings-page .referral-page .body-wrapper .sub-text{
color:rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .referral-page .body-wrapper .referral-link-wrapper{
background:rgba(0, 0, 0, 0.1);
border:1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .settings-page .referral-page .body-wrapper .referral-link-wrapper .text-wrapper .title{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .settings-page .referral-page .body-wrapper .referral-link-wrapper .text-wrapper .link-text{
color:rgba(255, 255, 255, 0.9);
}

body.dark-theme .settings-page .customer-support-page .body-wrapper .heading .close-button{
color: rgba(255, 255, 255, 0.8);
}
body.dark-theme .settings-page .customer-support-page .body-wrapper .heading .text{
color: rgba(255, 255, 255, 0.8);
}


@media screen and (min-width: 950px) {
    
    .settings-page .main-page{
        padding:0 0 0 300px;
    }
    .settings-page .linked-wallets-page{
        padding:0 0 0 300px;
    }
    .settings-page .change-email-page{
        padding:0 0 0 300px;
    }
    .settings-page .change-password-page{
        padding:0 0 0 300px;
    }
    .settings-page .referral-page{
        padding:0 0 0 300px;
    }
    .settings-page .customer-support-page{
        padding:0 0 0 300px;
    }

    .settings-page .main-page .body-wrapper .profile-wrapper{
        margin: 25px 0 0;
    }
    .settings-page .main-page .body-wrapper .button-link-wrapper{
        gap: 10px;
    }
    .settings-page .main-page .body-wrapper .button-link-wrapper .button-link{
        width: calc(50% - 5px);
        border: 1px solid #e5e5e5;
        background: #f8f8f8;
        padding: 0 20px;
        height: 70px;
        border-radius: 5px;
    }
    .settings-page .main-page .body-wrapper .button-link-wrapper .button-link:hover{
        background:#e5e5e5;
    }


    /* DARK MODE */
    body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link{
        background: var(--light-black);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    body.dark-theme .settings-page .main-page .body-wrapper .button-link-wrapper .button-link:hover{
        background:rgba(255,255,255,0.1);
    }


}.verify-email-page{
position: fixed;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: #fff;
z-index: 0;
transition: .1s;
overflow-y: auto;
display: flex;
align-items: center;
justify-content: center;
padding:0 !important;
}
.verify-email-page.show{
left:0;
}

.verify-email-page .body-wrapper {
width: min(500px, calc(100% - 40px));
max-height:calc(100% - 40px);
overflow:auto;
padding:40px 25px 20px;
border: 1px solid #f1f1f1;
border-radius: 10px;
background:#f8f8f8;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
gap: 0;
}

.verify-email-page .body-wrapper .heading{
font-family:'fontawesome';
font-size: 15px;
color: #444;
font-weight: 400;
width: 100%;
text-align: center;
letter-spacing:0.4mm;
}
.verify-email-page .body-wrapper .input-field-wrapper-container{
display: flex;
align-items:center;
justify-content:center;
flex-direction: row;
flex-wrap: wrap;
gap:0 15px;
width:100%;
margin:15px 0 0;
}
.verify-email-page .body-wrapper .input-field-wrapper{
height:60px;
width:100%;
background: transparent;
border: 1px solid #d1d1d1;
border-radius:5px;
position:relative;
overflow:hidden;
margin:15px 0 0;
}
.verify-email-page .body-wrapper .input-field-wrapper .icon{
width:50px;
height: 100%;
position:absolute;
top:0;
left:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: center;
cursor:text;
}
.verify-email-page .body-wrapper .input-field-wrapper .placeholder-text{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:flex;
align-items: center;
justify-content: flex-start;
font-family:sans-serif;
transition:.2s;
cursor:text;
}
.verify-email-page .body-wrapper .input-field-wrapper.password .placeholder-text{
width:calc(100% - 100px);
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field{
width:calc(100% - 50px);
height: 100%;
position:absolute;
top:0;
left:50px;
background: transparent;
color:#444;
font-size:14px;
border: none;
z-index: 1;
}
.verify-email-page .body-wrapper .input-field-wrapper.password .input-field{
width:calc(100% - 100px);
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field:focus~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field:valid~.placeholder-text{
height: 11px;
top: 5px;
left: 50px;
font-size: 11px;
z-index: 0;
}
.verify-email-page .body-wrapper .input-field-wrapper .toggle-password-button{
width:50px;
height: 100%;
position:absolute;
top:0;
right:0;
background: transparent;
color:#555;
font-size:14px;
z-index:2;
display:none;
align-items: center;
justify-content: center;
cursor: pointer;
}
.verify-email-page .body-wrapper .input-field-wrapper.password .toggle-password-button{
display:flex;
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-closed-icon{
display:block;
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field[type="text"]~.toggle-password-button .eye-open-icon{
display:none;
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-open-icon{
display:block;
}
.verify-email-page .body-wrapper .input-field-wrapper .input-field[type="password"]~.toggle-password-button .eye-closed-icon{
display:none;
}

.verify-email-page .body-wrapper .error-text-wrapper{
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
padding: 10px 15px;
border-radius: 5px;
margin: 10px 0 0;
width: 100%;
background: #f8f8f8;
gap: 5px;
border: 1px solid #d1d1d1;
}
.verify-email-page .body-wrapper .error-text-wrapper.show{
display:flex;
}
.verify-email-page .body-wrapper .error-text-wrapper .error-text{
font-family: var(--default-font);
font-size: 11px;
color: #f55;
font-weight: 500;
width: 100%;
line-height: 14px;
display: none;
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
gap: 10px
}
.verify-email-page .body-wrapper .error-text-wrapper .error-text.show{
display:flex;
}


.verify-email-page .body-wrapper .email-verification-text{
font-family:sans-serif;
font-size: 14px;
color:#444;
font-weight: 400;
width: 100%;
line-height: 20px;
margin: 15px 0 0;
}
.verify-email-page .body-wrapper .resend-code-button{
padding:10px 20px;
border:1px solid #d1d1d1;
border-radius:5px;
font-family:sans-serif;
font-size: 11px;
margin:15px 0 0;
background:transparent;
color:#444;
position: relative;
overflow: hidden;
cursor: pointer;
}


.verify-email-page .body-wrapper .submit-button{
height:50px;
padding:0 30px;
border:none;
border-radius:5px;
font-family:'fontawesome';
font-size: 14px;
letter-spacing:0.5mm;
margin:15px 0 0;
display: flex;
align-items: center;
justify-content:center;
background:var(--dark-green);
color:white;
gap:5px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.verify-email-page .body-wrapper .logout-button{
height:50px;
padding:0 30px;
border:none;
border-radius:5px;
font-family:'fontawesome';
font-size: 14px;
letter-spacing:0.5mm;
margin:15px 0 0;
display: flex;
align-items: center;
justify-content:center;
background:transparent;
color:#f44;
gap:5px;
position: relative;
overflow: hidden;
cursor: pointer;
}









/* DARK MODE */
body.dark-theme .verify-email-page .body-wrapper{
background:rgba(0,0,0,0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .verify-email-page .body-wrapper .heading{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .verify-email-page .body-wrapper .email-verification-text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .verify-email-page .body-wrapper .resend-code-button{
color:rgba(255, 255, 255, 0.7);
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .verify-email-page .body-wrapper .input-field-wrapper{
border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-theme .verify-email-page .body-wrapper .input-field-wrapper .icon{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .verify-email-page .body-wrapper .input-field-wrapper .placeholder-text{
color:rgba(255, 255, 255, 0.7);
}
body.dark-theme .verify-email-page .body-wrapper .input-field-wrapper .input-field{
color:rgba(255, 255, 255, 0.9);
}
body.dark-theme .verify-email-page .body-wrapper .error-text-wrapper{
background:rgba(0,0,0,0.1);
border: 1px solid rgba(255, 255, 255, 0.1);
}


@media screen and (min-width: 950px) {
}