@charset "utf-8";
@import "icon/icon.css";

:root{
	--navy:#020a38;
	--accent:#35c3f1;
	--accent-hover:#1e9ed1;
	--tint:#e7f6fd;
	--tint-text:#1587b8;
	--card-bg:#ffffff;
	--input-border:#dbe4e7;
	--text-primary:#020a38;
	--text-body:#3a4356;
	--text-muted:#7b8494;
	--text-faint:#a5aebc;
	--danger:#e2574c; --danger-bg:#fdeeec; --danger-text:#b8443a;
}

html, body {
	text-align: center;margin: 0;padding: 0;width: 100%;height:100%;font-size: 14px;line-height: 1.3em;font-family:'Manrope', sans-serif;color: var(--text-body);font-weight: 400;cursor:default;min-width:1000px;
	background: var(--card-bg);
}
img {border:none; max-width:100%;}
*, *::before, *::after{box-sizing:border-box;}
address, article, aside, figcaption, figure, footer, header, main, nav, section, ol{display:block; margin:0; padding:0;}
h1,h2,h3,h4,h5, dl, p{margin:0;padding:0;}
input, textarea, select {font-family: 'Manrope', sans-serif;line-height:17px; font-size:15px; font-weight:500; -webkit-user-select: auto;  -moz-user-select: auto;  -ms-user-select: auto; user-select: auto;}
button{font-family: 'Manrope', sans-serif;-webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none; user-select: none;}
*:focus {outline: none;}
iframe{max-width:100% !important;border:none;}
a{text-decoration:none;color: var(--navy);}
[fm]{font-family: 'Manrope', sans-serif;}
[cm]{display:flex;align-items: center;justify-content: center;}
[clear]{clear:both;}
[txl]{text-align:left;}
[txr]{text-align:right;}
[txc]{text-align:center;}
[pr]{position:relative;}
[pa]{position:absolute;}
[cp]{cursor:pointer;}

.sipad{display:grid;grid-template-columns:1.2fr 1fr;min-height:100%;padding:0;}

/* Left brand panel */
.lbrand{background: var(--navy);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:40px;text-align:center;}
.lbrand .lbrandcard{background:#fff;border-radius:20px;padding:20px 32px;}
.lbrand .lbrandcard img{width:220px;display:block;}
.lbrand h1{margin:0;color:#fff;font-size:24px;font-weight:800;}
.lbrand p{margin:8px 0 0;color:rgba(255,255,255,0.55);font-size:14px;}
.lbranddots{display:flex;gap:8px;justify-content:center;}
.lbranddots i{width:8px;height:8px;border-radius:50%;background:rgba(53,195,241,0.25);}
.lbranddots i:first-child{background: var(--accent);}

/* Right form panel */
.lpanel{display:flex;align-items:center;justify-content:center;background:#fff;padding:40px;}
.login{width:100%;max-width:360px;margin:0 auto;padding:0;box-shadow:none;text-align:left;}
.lhead{margin:0 0 22px 0;}
.lhead h2{margin:0;font-size:22px;font-weight:800;color: var(--text-primary);}
.lhead p{margin:4px 0 0;font-size:13px;color: var(--text-muted);}

.login section{padding:0;}
.login section dl{margin:0 0 16px 0;}
.login section dl label{display:block;font-size:12.5px;font-weight:700;color: var(--text-body);padding:0 0 6px 2px;}
.login section dl i{height:30px;left:6px;top:26px;width:30px;font-size:17px;border-radius:50%;color: var(--text-faint);}
[inpt] input{width:100%;padding:0 18px 0 45px;height:44px;border:1px solid var(--input-border);border-radius:10px;background: #fff;vertical-align:top;transition:all 0.2s ease;color: var(--text-primary);}
.login section dl input:hover ~ i{color: var(--accent-hover);}
.login section dl input:focus{border-color: var(--accent);background:#fff;}
.login section dl input:focus ~ i{color: var(--accent);}
.pssw{font-size:15px;letter-spacing:2px;}
.login section dl span{width:40px;height:30px;right:0;top:26px;font-size:17px;color: var(--text-faint);}
.login section dl span:hover{color: var(--text-muted);}

.lsignbt{padding:6px 0 0 0;}
.signin{width:100%;height:44px;border-radius:10px;background: var(--navy);font-size:14.5px;font-weight:800;color: #fff;transition:background .15s,color .15s;}
.signin:hover{background: var(--accent);color: var(--navy);}

.lfoot{margin:22px 0 0;text-align:center;font-size:12px;color: var(--text-faint);}

::-moz-selection { background: #caff86 !important; color: #222;}
::selection { background: #caff86 !important; color: #222;}
input::-moz-selection { background: #a7f541 !important; }
input::selection { background: #a7f541 !important; }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {font-size:15px;border: 1px solid var(--input-border);border-radius:10px;-webkit-text-fill-color: var(--text-primary);-webkit-box-shadow: 0 0 0px 1000px #fff inset;transition: background-color 5000s ease-in-out 0s;}
::-webkit-input-placeholder {font-size:14px;letter-spacing:0;color: var(--text-faint);}
:-ms-input-placeholder {font-size:14px;letter-spacing:0;color: var(--text-faint);}
::placeholder {font-size:14px;letter-spacing:0;color: var(--text-faint);}

@media(max-width:820px){
	.sipad{grid-template-columns:1fr;}
	.lbrand{display:none;}
}