body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    padding: 0;
	margin: 0px;
	background: #000;
	font-family: "Manrope", sans-serif;
}

:focus-visible {
    outline: none;
}

a {
    color: #f5be09;
    text-decoration: none;
}

button{
	border: none;
	font-weight: 600;
	font-family: "Manrope", sans-serif;
	cursor: pointer;
}
.siteloader {
    display: flex;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: #000000b0;
    text-align: center;
    backdrop-filter: blur(2px);
    align-items: center;
    justify-content: center;
}
.img-loader {
    width: 120px;
}
.loginreg {
    position: relative;
}

.loginreg video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.loginreg:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #ecb500;
    z-index: 2;
    mix-blend-mode: color;
    position: absolute;
    inset: 0%;
	top: 0;
    left: 0;
}

.loginreg:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000000ad;
    background: #000000bd;
    z-index: 1;
	top: 0;
    left: 0;
}

.page-wrapper {
    display: flex;
    width: 100%;
    position: relative;
    min-height: 100vh;
    padding: 0;
    align-items: center;
    background: #000;
}

.wrapper {
    padding: 70px 0 20px 0;
}

.form-section{
	max-width: 550px;
    margin: auto;
    width: 100%;
    border: 1px solid transparent;
    border-radius: 16px;
    background: linear-gradient(#000000, #130e01) padding-box, linear-gradient(86deg, #130e01 0%, #dca912 25%, #fff0a5 50%, #dca912 75%, #000000 100%) border-box;
    box-shadow: 0 0 20px rgba(220, 169, 18, 0.15), inset 0 0 10px rgba(220, 169, 18, 0.08);
	padding: 25px;
	position: relative;
    z-index: 2;
}

.form-section h1{
	margin: 0;
    font-size: 36px;
    line-height: 45px;
    letter-spacing: -0.5px;
	font-weight: 600;
}

.description{
	margin: 10px 0 30px 0;
    font-size: 16px;
    line-height: 26px;
}

.main-button {
    background: linear-gradient(-153deg, #f6c81a 4%, #fefb76 15%, #fbcc0d 35%, #fffa7a 71%, #e9af03 93%);
    color: #17130b;
    font-size: 16px;
    font-weight: 600;
    padding: 14px 20px;
    box-shadow: 0 14px 30px rgba(214, 177, 74, 0.24);
    width: 100%;
    border-radius: 10px;
	display: block;
    text-align: center;
}

.connect_wallet {
    width: 100%;
    max-width: 450px;
    margin: auto;
    text-align: center;
}

.coin_img{
	width: 100%;
    max-width: 120px;
    margin: -80px auto 30px auto;
    display: flex;
    box-shadow: 0 0 62px #fcea4c66;
    border-radius: 100%;
}

select.form-control,
select.form-control:focus {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%23f6c81a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 24px;
}

#pconnectWallet,
#pconnectWallet2 {
    background: rgb(5 223 114 / 20%);
    border: 1px solid rgb(5 223 114 / 40%);
    border-radius: 10px;
    color: #05df72;
    text-align: left;
    padding: 5px 10px;
    font-size: 13px;
    line-height: 18px;
    display: flex;
    align-items: center;
    gap: 7px;
    font-weight: 600;
    margin: 20px 0;
}

div#pconnectWallet:before,
div#pconnectWallet2:before {
    content: '\2713';
    width: 18px;
    height: 18px;
    margin: 2px 0 0 0;
    border-radius: 50%;
    background: #05df72;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: #000000;
    min-width: 18px;
}

.success-icon {
    width: 18px;
    height: 18px;
    margin: 4px 0 0 0;
    border-radius: 50%;
    background: #05df72;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: #000000;
    min-width: 18px;
}

.wallet-box {
    padding: 15px;
    margin-bottom: 20px;
    text-align: left;
    border: 1px solid #ffffff0d;
    border-radius: 16px;
    background-color: #0000000d;
    background-color: #1f1708;
    background-image: radial-gradient(circle closest-corner at 0 0, #eae9ed0f, #0000);
    position: relative;
    z-index: 111;
}

.address-field {
    font-size: 18px;
    word-break: break-all;
}

.address-field label {
    color: #fff;
    margin-bottom: 5px;
    font-size: 14px;
    display: block;
	font-weight: 500;
}

.wallet-pill {
    color: #f5be09;
    border-radius: 5px;
    font-size: 18px;
    display: flex;
    font-weight: 500;
}

.wallet-pill .walletaddress {
    width: 85%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.copyaddress{
	cursor: pointer;
	position: relative;
}

.wallet-pill svg {
    width: 16px;
    fill: #f5be09;
	cursor: pointer;
}

.wallet_connected h1,
.wallet_connected .description{
	text-align: center;
}

.security-box {
    display: flex;
    gap: 10px;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ffffff0d;
    border-radius: 16px;
    background-color: #0000000d;
    background-image: radial-gradient(circle closest-corner at 0 0, #eae9ed0f, #0000);
}

.security-box .shield {
    width: 100%;
    max-width: 80px;
	min-width: 50px;
}

.shield img{
	width: 100%;
    mix-blend-mode: lighten;
    border-radius: 10px;
}

.security-box p{
	font-size: 13px;
    margin: 0px;
    font-weight: 500;
}

.confirm-box {
    display: flex;
    align-items: flex-start;
    gap: 10px;
	margin: 20px 0 30px 0;
}

.confirm-box input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid #e9af03;
    border-radius: 4px;
    background: transparent;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: all .25s ease;
	margin-top: 5px;
}

.confirm-box input[type="checkbox"]:checked {
    background: #dca912;
    border-color: #dca912;
}

.confirm-box input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 0px;
    width: 5px;
    height: 10px;
    border: solid #111;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.confirm-box label {
    font-size: 14px;
    cursor: pointer;
    font-weight: 500;
}

.continue-btn{
	pointer-events: none;
	opacity: .5;
}

.continue-btn.enabled{
	pointer-events: initial;
	opacity: 1;
}

.copyaddress .tooltip {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: #000000;
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    font-size: 12px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: .2s ease;
    pointer-events: none;
}

.copyaddress .tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: #000000;
}

.copyaddress:hover .tooltip {
    opacity: 1;
    visibility: visible;
}

.registration-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 10px;
    width: 100%;
}

.form-group {
    position: relative;
    display: flex;
    flex-direction: column;
}

.spanLable {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    text-align: left;
}

.form-control {
    padding: 12px 15px;
    border-radius: 8px;
    font-size: 15px;
    color: #ffffff;
    border: none;
    background: #1e1d1d;
    border:1px solid #1e1d1d;
}

.form-control::placeholder{
	color: #a5a5a5;
	font-size: 14px;
}

.form-control:focus {
    border-color: #f5be09;
    background: #1e1d1d;
    box-shadow: none;
	color: #fff;
}

    .form-control:disabled {
        background: #1e1d1d;
        box-shadow: none;
        color: #fff;
    }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-text-fill-color: #fff;
    -webkit-box-shadow: 0 0 0px 1000px #1e1d1d inset;
    caret-color: #fff;
    border: 1px solid #1e1d1d;
}

.iziToast.iziToast-color-green {
    background: rgb(1 19 9) !important;
    border: 1px solid rgb(5 223 114 / 40%) !important;
}

.iziToast > .iziToast-body .iziToast-message, .iziToast > .iziToast-body .iziToast-title {
    font-size: 13px !important;
}

.iziToast.iziToast-color-green .iziToast-message {
    color: #05df72 !important;
}

.iziToast > .iziToast-close {
    filter: invert(100);
    background-size: 12px !important;
}

.iziToast.iziToast-color-red {
    background: #180204 !important;
    border: 1px solid #fd32497a !important;
}

.iziToast.iziToast-color-red .iziToast-message {
    color: #FD3249 !important;
}

.iziToast.iziToast-color-orange {
    background: #1f1803 !important;
    border: 1px solid #f5be097d !important;
}

.iziToast.iziToast-color-orange .iziToast-message {
    color: #f5be09 !important;
}
 

.registration-grid > :first-child {
    grid-column: 1 / -1;
}

.form-group p.username {
    background: #f5be091f;
    border: 1px solid #f5be09;
    padding: 4px;
    font-size: 13px;
    border-radius: 5px;
    color: #f5be09;
    margin: 5px 0 0 0;
    text-align: left;
}

#dvLogin,
#DivRegister,
#DivOTP{
	display: none;
}

.ErrorMessage {
    padding: 6px;
    border-radius: 5px;
    margin: 6px 0 0 0;
    font-size: 12px;
    width: 100%;
    color: #f44336e0;
    background-color: #f443361f;
    border: 1px solid #f4433654;
    font-weight: 600;
    /*display: none;*/
}

.otp-container {
    display: flex;
    gap: 6px;
    margin: 10px 0 20px 0;
}

.otp-input {
    width: 100%;
    border: none;
    height: 44px;
    text-align: center;
    outline: none;
    border-radius: 0;
    font-size: 20px;
    background: transparent;
    border-bottom: 3px solid #303030;
    color: #fff;
    font-weight: 500;
}

.otp-input:focus{
	border-color: #f5be09;
}

.resend_otp {
    font-size: 15px;
    color: #f5f5f5;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

@media screen and (max-width: 767.9px){
	.wrapper {
		padding-left: 15px;
		padding-right: 15px;
		width: 100%;
	}
	.coin_img{
		margin: -70px auto 10px auto;
		max-width: 90px;
	}
	.form-section{
		padding: 20px;
	}
	.form-section h1{
		font-size: 26px;
		line-height: 34px;
	}
	.description {
		margin: 10px 0 30px 0;
		font-size: 15px;
		line-height: 22px;
	}
	.main-button{
		padding: 10px 15px;
		font-size: 15px;
	}
	.wallet-box{
		padding: 10px;
	}
	.wallet-pill{
		font-size: 16px;
	}
	.security-box p{
		font-size: 12px;
	}
	.confirm-box label{
		font-size: 12px;
	}
	.registration-grid{
		grid-template-columns: repeat(1, 1fr);
	}
	.confirm-box{
		margin: 20px 0 20px 0;
	}
}