/* CH LMS Portal - login / register styles. Prefix: chlms- */
.chlms-auth{
	--chlms-primary:#7c3aed;
	--chlms-accent:#a855f7;
	--chlms-bg:#ffffff;
	--chlms-text:#1e1b2e;
	--chlms-muted:#6b7280;
	--chlms-border:#e5e7eb;
	--chlms-input:#f9fafb;
	--chlms-danger:#dc2626;
	--chlms-ok:#16a34a;
	box-sizing:border-box;
	width:100%;
	display:flex;
	justify-content:center;
	padding:24px 16px;
	font-family:inherit;
	color:var(--chlms-text);
}
.chlms-auth *,.chlms-auth *::before,.chlms-auth *::after{box-sizing:border-box}
.chlms-auth.chlms-theme-dark{
	/* v1.2.1: dark background colour is editable in Settings (default black) */
	--chlms-bg:var(--chlms-dark-bg,#000000);
	--chlms-text:#f5f5f5;
	--chlms-muted:#a3a3a3;
	--chlms-border:color-mix(in srgb,var(--chlms-bg) 84%,#fff);
	--chlms-input:color-mix(in srgb,var(--chlms-bg) 94%,#fff);
}
.chlms-theme-dark .chlms-card{box-shadow:0 20px 50px -20px rgba(0,0,0,.9)}
.chlms-card{
	width:100%;
	max-width:440px;
	background:var(--chlms-bg);
	border:1px solid var(--chlms-border);
	border-radius:20px;
	padding:32px 28px;
	box-shadow:0 20px 50px -20px rgba(76,29,149,.35);
}
.chlms-wide .chlms-card{max-width:640px}
.chlms-center{text-align:center}
.chlms-brand{text-align:center;margin-bottom:14px}
.chlms-brand img{max-height:56px;width:auto;max-width:100%}
.chlms-brand-text{font-weight:800;font-size:22px;letter-spacing:.5px;background:linear-gradient(90deg,var(--chlms-primary),var(--chlms-accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.chlms-card h2{margin:0 0 6px;font-size:24px;line-height:1.25;text-align:center;color:var(--chlms-text)}
.chlms-sub{margin:0 0 22px;text-align:center;color:var(--chlms-muted);font-size:14px}

.chlms-grid{display:flex;flex-wrap:wrap;gap:14px 14px}
.chlms-grid .chlms-field{flex:1 1 100%;margin:0}
.chlms-grid .chlms-field.chlms-half{flex:1 1 calc(50% - 7px);min-width:180px}
.chlms-form>.chlms-field,.chlms-form>.chlms-row{margin-bottom:14px}
.chlms-grid{margin-bottom:14px}

.chlms-field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--chlms-text)}
.chlms-field label em{color:var(--chlms-danger);font-style:normal}
.chlms-field input[type=text],
.chlms-field input[type=email],
.chlms-field input[type=tel],
.chlms-field input[type=number],
.chlms-field input[type=date],
.chlms-field input[type=url],
.chlms-field input[type=password],
.chlms-field input[type=file],
.chlms-field select,
.chlms-field textarea{
	width:100%;
	padding:12px 14px;
	font:inherit;
	font-size:15px;
	color:var(--chlms-text);
	background:var(--chlms-input);
	border:1.5px solid var(--chlms-border);
	border-radius:12px;
	outline:none;
	transition:border-color .15s,box-shadow .15s;
	margin:0;
}
.chlms-field input:focus,.chlms-field select:focus,.chlms-field textarea:focus{
	border-color:var(--chlms-primary);
	box-shadow:0 0 0 4px color-mix(in srgb,var(--chlms-primary) 18%,transparent);
}
.chlms-field.chlms-invalid input,
.chlms-field.chlms-invalid select,
.chlms-field.chlms-invalid textarea{border-color:var(--chlms-danger)}
.chlms-err{display:block;min-height:0;font-size:12.5px;color:var(--chlms-danger);margin-top:5px}
.chlms-err:empty{display:none}
.chlms-hint{display:block;margin-top:5px;font-size:12px;color:var(--chlms-muted)}

.chlms-pw{position:relative}
.chlms-pw input{padding-right:64px!important}
.chlms-eye{
	position:absolute;right:8px;top:50%;transform:translateY(-50%);
	background:none;border:0;cursor:pointer;
	font-size:12px;font-weight:700;color:var(--chlms-primary);padding:6px 8px;
}

.chlms-check{display:flex!important;align-items:flex-start;gap:8px;font-weight:500!important;cursor:pointer}
.chlms-check input{margin-top:3px;accent-color:var(--chlms-primary)}
.chlms-radios{display:flex;flex-wrap:wrap;gap:8px 18px}
.chlms-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px}

.chlms-btn{
	display:flex;align-items:center;justify-content:center;gap:8px;
	width:100%;padding:13px 18px;border:0;border-radius:12px;cursor:pointer;
	font:inherit;font-size:15px;font-weight:700;color:#fff!important;text-decoration:none!important;
	background:linear-gradient(135deg,var(--chlms-primary),var(--chlms-accent));
	box-shadow:0 10px 24px -10px var(--chlms-primary);
	transition:transform .12s,opacity .12s;
}
.chlms-btn:hover{transform:translateY(-1px)}
.chlms-btn:disabled{opacity:.7;cursor:wait;transform:none}
.chlms-center .chlms-btn{display:inline-flex;width:auto;min-width:200px}
.chlms-spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:chlms-rot .7s linear infinite}
@keyframes chlms-rot{to{transform:rotate(360deg)}}

.chlms-link{color:var(--chlms-primary)!important;font-weight:600;text-decoration:none}
.chlms-link:hover{text-decoration:underline}
.chlms-center .chlms-link{display:block;margin-top:14px}
.chlms-foot{margin:18px 0 0;text-align:center;font-size:14px;color:var(--chlms-muted)}

.chlms-msg{padding:11px 14px;border-radius:12px;font-size:14px;margin-bottom:14px}
.chlms-msg.is-error{background:rgba(220,38,38,.1);color:var(--chlms-danger);border:1px solid rgba(220,38,38,.3)}
.chlms-msg.is-ok{background:rgba(22,163,74,.1);color:var(--chlms-ok);border:1px solid rgba(22,163,74,.3)}
.chlms-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}

@media (max-width:520px){
	.chlms-card{padding:26px 18px;border-radius:16px}
	.chlms-grid .chlms-field.chlms-half{flex:1 1 100%}
}

/* ---------- full page canvas ---------- */
body.chlms-canvas{margin:0;background:#fff}
body.chlms-canvas.chlms-dark{background:#000}
body.chlms-canvas .chlms-canvas-main{min-height:100vh}

/* ---------- split layout ---------- */
.chlms-auth.chlms-layout-split{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,1fr);
	padding:0;
	min-height:640px;
	align-items:stretch;
}
.chlms-canvas .chlms-auth.chlms-layout-split{min-height:100vh}
.chlms-side{
	position:relative;
	background-color:var(--chlms-primary);
	background-size:cover;
	background-position:center;
	color:#fff;
	overflow:hidden;
}
.chlms-side::before{
	content:"";position:absolute;inset:0;
	background:linear-gradient(160deg,color-mix(in srgb,var(--chlms-primary) 92%,#000) 0%,color-mix(in srgb,var(--chlms-primary) 70%,transparent) 55%,color-mix(in srgb,var(--chlms-accent) 55%,transparent) 100%);
}
/* v1.1.2: plain image side - no colour overlay, no text */
.chlms-side.chlms-side-img::before{display:none}
.chlms-side-inner{
	position:sticky;top:0;z-index:1;
	height:100vh;max-height:100%;min-height:560px;
	display:flex;flex-direction:column;justify-content:space-between;
	padding:40px;
}
.chlms-side-brand img{max-height:48px;width:auto;max-width:220px}
.chlms-side-brand span{font-weight:800;font-size:22px;letter-spacing:.5px}
.chlms-side-text h1{margin:0 0 10px;font-size:clamp(32px,4vw,56px);line-height:1.1;font-weight:800;color:#fff}
.chlms-side-text p{margin:0;font-size:17px;max-width:420px;color:rgba(255,255,255,.88);border-left:4px solid rgba(255,255,255,.7);padding-left:14px}
.chlms-side-foot{font-size:14px;color:rgba(255,255,255,.85)}
.chlms-layout-split .chlms-main{
	display:flex;align-items:center;justify-content:center;
	padding:40px 28px;background:var(--chlms-bg);
}
.chlms-layout-split .chlms-card{
	background:transparent;border:0;box-shadow:none;padding:0;max-width:440px;border-radius:0;
}
.chlms-layout-split.chlms-wide .chlms-card{max-width:580px}
.chlms-layout-split .chlms-card h2,
.chlms-layout-split .chlms-card .chlms-sub{text-align:left}
.chlms-layout-split .chlms-card h2{font-size:32px;font-weight:800}
.chlms-layout-split .chlms-card .chlms-brand{display:none}
@media (max-width:900px){
	.chlms-auth.chlms-layout-split{grid-template-columns:1fr;min-height:0}
	.chlms-canvas .chlms-auth.chlms-layout-split{min-height:100vh}
	.chlms-layout-split .chlms-side{display:none}
	.chlms-layout-split .chlms-card .chlms-brand{display:block;text-align:left}
	.chlms-layout-split .chlms-main{align-items:flex-start;padding:32px 20px}
}

/* ---------- smart button ---------- */
.chlms-btn.chlms-btn-inline{display:inline-flex;width:auto;padding:12px 26px}
.chlms-btn.chlms-btn-outline{background:transparent;color:var(--chlms-primary)!important;border:2px solid var(--chlms-primary);box-shadow:none}

/* ---------- v1.2.0: forgot / reset password ---------- */
.chlms-form.chlms-done .chlms-field,
.chlms-form.chlms-done .chlms-btn,
.chlms-form.chlms-done .chlms-row{display:none}
.chlms-btn.chlms-btn-block{display:flex;width:100%;justify-content:center;text-decoration:none;margin-top:6px}

/* v1.9.5 Continue with Google: icon in its own fixed box (a theme can no longer squash it or glue it to the text),
   same look on phones / tablets / desktop, long text wraps instead of overflowing */
.chlms-google-wrap{margin:0 0 4px}
.chlms-auth a.chlms-google-btn{display:flex!important;flex-wrap:nowrap;align-items:center;justify-content:center;gap:0;width:100%;max-width:100%;min-height:48px;margin:0;padding:10px 16px;border:1px solid #dadce0;border-radius:12px;background:#fff;color:#1f1f1f!important;font:inherit;font-size:15px;font-weight:600;line-height:1.25;text-align:center;text-decoration:none!important;box-shadow:0 1px 2px rgba(0,0,0,.12);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:box-shadow .15s,background .15s}
.chlms-auth a.chlms-google-btn:hover,.chlms-auth a.chlms-google-btn:focus-visible{background:#f8f9fa;color:#1f1f1f!important;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.chlms-auth a.chlms-google-btn:active{background:#f1f3f4}
.chlms-auth a.chlms-google-btn:focus-visible{outline:2px solid var(--chlms-primary);outline-offset:2px}
.chlms-auth .chlms-google-btn .chlms-google-ic-box{flex:0 0 20px;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin:0 12px 0 0;padding:0}
.chlms-auth .chlms-google-btn .chlms-google-ic-box svg,.chlms-auth .chlms-google-btn svg.chlms-google-ic{display:block;flex:none;width:20px!important;height:20px!important;min-width:20px;max-width:none!important;margin:0!important;padding:0}
.chlms-auth .chlms-google-btn .chlms-google-txt{flex:0 1 auto;min-width:0;color:inherit;text-align:left;white-space:normal;overflow-wrap:anywhere}
.chlms-or{display:flex;align-items:center;gap:12px;margin:14px 0 16px;font-size:13px;color:var(--chlms-muted)}
.chlms-or::before,.chlms-or::after{content:"";flex:1;height:1px;background:var(--chlms-border)}
@media (max-width:480px){.chlms-auth a.chlms-google-btn{min-height:52px;padding:10px 14px}}
@media (max-width:340px){.chlms-auth a.chlms-google-btn{font-size:14px;padding:10px 10px}.chlms-auth .chlms-google-btn .chlms-google-ic-box{margin-right:10px}}
