html, body {
	overscroll-behavior: none;
}

/* container */
.gcaptche{
	display:flex;
	justify-content:center;
	width:100%;
}

/* recaptcha box */
.g-recaptcha{
	border-radius:12px;
	overflow:hidden;
	display:inline-block;
	transform-origin:center;
}

/* preloader box */
.preloader {
    position: fixed; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    z-index: 99999;
    background: 
    radial-gradient(circle at 20% 20%, rgba(255, 200, 0, .15), transparent 40%), 
    radial-gradient(circle at 80% 80%, rgba(0, 208, 148, .12), transparent 40%), 
    linear-gradient(135deg, #f8fafc, #eef2f7);
}

body.dark-mode .preloader{
	background:
	radial-gradient(circle at 15% 25%, rgba(240,185,11,0.14), transparent 50%),
	radial-gradient(circle at 85% 75%, rgba(0,208,148,0.12), transparent 50%),
	linear-gradient(140deg,#121212,#181818,#1c1c1c);
}

/* ===== WALLET REGISTER UI ===== */
.account::after{
	background-image: none !important;
}

.wallet-register{
    min-height:100vh;
    display:flex;
    align-items:center;

    background:
    radial-gradient(circle at 20% 20%, rgba(255,200,0,.15), transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(0,208,148,.12), transparent 40%),
    linear-gradient(135deg,#f8fafc,#eef2f7);
}

.form-label {
    font-size: 0.9rem;
    font-family: "Open Sans", sans-serif;
    color: #0f172a;
    font-weight: 500;
}

body.dark-mode .form-label {
	color: #f8fafc;
}

/* glass card */
.wallet-register .account__inner{
	backdrop-filter:blur(18px);
	background:rgba(255,255,255,0.65);
	border:1px solid rgba(255,255,255,0.35);
	border-radius:22px;
	box-shadow:
	0 20px 60px rgba(0,0,0,.12),
	inset 0 1px 0 rgba(255,255,255,.4);
	padding:55px;
}

/* title */

.wallet-register .account__header h2{
	font-size:34px;
	font-weight:700;
	color:#0f172a;
}

.wallet-register .account__header p{
	color:#64748b;
	font-size:15px;
	line-height:1.6;
}


/* logo */

.wallet-register .account__thumb{
	text-align:center;
}

.wallet-register .account__thumb img{
	max-width:390px;
	animation:walletFloat 5s ease-in-out infinite;
}

@keyframes walletFloat{
	0%{
	transform:translateY(0px);
	}
	
	50%{
	transform:translateY(-10px);
	}
	
	100%{
	transform:translateY(0px);
	}
}


/* input */
.wallet-register .form-control{
	height:54px;
	border-radius:14px;
	border:1px solid rgba(0,0,0,0.08);
	background:rgba(255,255,255,0.8);
	padding-left:18px;
	font-size:14px;
	transition:all .25s;
}

.wallet-register .form-control:focus{
	border-color:#f0b90b;
	box-shadow:0 0 0 3px rgba(240,185,11,.2);
	background:#fff;
}


/* checkbox */

.wallet-register .form-check-input{
	border-radius:6px;	
	border:1px solid rgba(0,0,0,0.2);
}

.wallet-register .form-check-input:checked{
	background-color:#f0b90b;
	border-color:#f0b90b;
}


/* register button */
.wallet-register .trk-btn{
	height:56px;
	border-radius:14px;
	font-weight:600;
	font-size:16px;
	background:linear-gradient(135deg,#f0b90b,#ffd76a);
	border:none;
	color:#1e293b;
	transition:all .25s;
}

.wallet-register .trk-btn:hover{
	transform:translateY(-2px);
	box-shadow:0 12px 30px rgba(240,185,11,.4);
}


/* switch login */
.wallet-register .account__switch{
	margin-top:25px;
	text-align:center;
}

.wallet-register .account__switch a{	
	color:#f0b90b;
	font-weight:600;
}


/* ===== DARK MODE ===== */
body.dark-mode .wallet-register{
	background:
	radial-gradient(circle at 15% 25%, rgba(240,185,11,0.14), transparent 50%),
	radial-gradient(circle at 85% 75%, rgba(0,208,148,0.12), transparent 50%),
	linear-gradient(140deg,#121212,#181818,#1c1c1c);
}

body.dark-mode .wallet-register .account__inner{
	background:rgba(18,18,18,0.72);
	border:1px solid rgba(255,255,255,0.06);
	box-shadow:
	0 25px 70px rgba(0,0,0,0.85),
	inset 0 1px 0 rgba(255,255,255,0.03);
	backdrop-filter:blur(16px);
}


body.dark-mode .wallet-register .account__header h2{
	color:#f8fafc;
}

body.dark-mode .wallet-register .account__header p{
	color:#94a3b8;
}


body.dark-mode .wallet-register .form-control{
	background:#1c1c1c;
	border:1px solid rgba(255,255,255,.06);
	color:#e5e5e5;
}

body.dark-mode .wallet-register .form-control::placeholder{
color:#777;
}

body.dark-mode .wallet-register .form-control:focus{
	border-color:#f0b90b;
	box-shadow:0 0 0 3px rgba(240,185,11,.25);
}


/* link */
body.dark-mode .wallet-register .account__switch p{
	color:#94a3b8;
}

body.dark-mode .wallet-register .account__switch a{
	color:#f0b90b;
}

/* error text */
.wallet-register .text-danger{
	font-size:13px;
}


/* responsive */
@media(max-width:991px){

	.wallet-register .account__inner{
		padding:20px;
	}
	
	.wallet-register .account__thumb img{
		max-width:220px;
	}
	
	.wallet-register .account__header h2{
		font-size:26px;
	}

}

@media (max-width:220px){
	.g-recaptcha{
		transform:scale(.66);
	}
}

@media (max-width:320px){
	.g-recaptcha{
		transform:scale(.82);
	}
}


/*
CSS Toggle Button
*/

.wallet-dark-toggle{
	position:absolute;
	top:25px;
	right:25px;
	z-index:10;
}

#darkmodeSwitch{
	width:42px;
	height:42px;
	border-radius:50%;
	border:none;
	cursor:pointer;
	background:rgba(255,255,255,0.6);
	backdrop-filter:blur(10px);
	font-size:18px;
	box-shadow:0 4px 12px rgba(0,0,0,0.12);
	transition:all .25s ease;
}

#darkmodeSwitch:hover{
	transform:scale(1.08);
}

body.dark-mode #darkmodeSwitch {
    background: #020617;
    color: #fff;
}

/* ===== WALLET CHECKBOX ===== */

.wallet-checkbox .form-check{
	display:flex;
	align-items:center;
	gap:10px;
}

.wallet-checkbox .form-check-input{
	width:20px;
	height:20px;
	border-radius:6px;
	border:1px solid rgba(0,0,0,0.2);
	cursor:pointer;
	transition:all .25s ease;
}

.wallet-checkbox .form-check-input:checked{
	background-color:#f0b90b;
	border-color:#f0b90b;
	box-shadow:0 0 0 3px rgba(240,185,11,.25);
}

.wallet-checkbox .form-check-label{
	font-size:14px;
	color:#334155;
}

.wallet-checkbox .form-check-label a{
	color:#f0b90b;
	font-weight:600;
	text-decoration:none;
}

.wallet-checkbox .form-check-label a:hover{
	text-decoration:underline;
}


/* ===== DARK MODE ===== */
body.dark-mode .wallet-checkbox .form-check-input{
	background:#1c1c1c;
	border:1px solid rgba(255,255,255,.15);
}

body.dark-mode .wallet-checkbox .form-check-input:checked{
	background:#f0b90b;
	border-color:#f0b90b;
}

body.dark-mode .wallet-checkbox .form-check-label{
	color:#e5e5e5;
}

body.dark-mode .wallet-checkbox .form-check-label a{
	color:#f0b90b;
}