*{box-sizing:border-box}
html,body{margin:0;padding:0}
body.eslcamp-auth-ui{font-family:"Estedad",Tahoma,sans-serif;background:var(--eca-bg,#F7F8FC);color:#29263b}
.eca-auth-page{min-height:100vh;display:grid;place-items:center;padding:34px 18px;background:
radial-gradient(circle at 12% 12%,rgba(36,91,232,.10),transparent 26%),
radial-gradient(circle at 88% 90%,rgba(232,114,93,.10),transparent 30%),
var(--eca-bg,#F7F8FC)}
.eca-auth-shell{width:min(1120px,100%);min-height:690px;background:#fff;border:1px solid #e7e8ef;border-radius:36px 10px 36px 10px;overflow:hidden;display:grid;grid-template-columns:42% 58%;box-shadow:0 30px 80px rgba(25,22,60,.12)}
.eca-auth-brand{position:relative;overflow:hidden;padding:38px;background:linear-gradient(145deg,var(--eca-ink,#100659),#24399d 65%,#325bd1);color:#fff;display:flex;flex-direction:column}
.eca-auth-brand:before{content:"";position:absolute;width:440px;height:440px;border-radius:50%;border:1px solid rgba(255,255,255,.08);right:-260px;top:-170px;box-shadow:0 0 0 48px rgba(255,255,255,.025),0 0 0 98px rgba(255,255,255,.02)}
.eca-auth-brand:after{content:"";position:absolute;width:220px;height:220px;border-radius:48px;background:var(--eca-accent,#E8725D);opacity:.12;left:-95px;bottom:-90px;transform:rotate(24deg)}
.eca-brand-link{position:relative;z-index:2;display:inline-flex;flex-direction:column;align-items:flex-start;text-decoration:none!important;color:#fff!important}
.eca-brand-link strong{font-size:31px;line-height:1;font-weight:900;letter-spacing:-1.5px}.eca-brand-link strong span{color:var(--eca-accent,#E8725D)}
.eca-brand-link img{max-width:190px;max-height:62px;object-fit:contain;margin-bottom:4px}
.eca-brand-link small{font-size:9px;color:#b8c4ef;margin-top:6px}
.eca-brand-copy{position:relative;z-index:2;margin:auto 0}
.eca-brand-copy>span,.eca-kicker{font-size:10px;font-weight:900;letter-spacing:.4px;color:#9db8ff}
.eca-brand-copy h1{font-size:45px;line-height:1.34;margin:8px 0 12px;color:#fff}
.eca-brand-copy p{font-size:13px;line-height:2;color:#d7dcf5;max-width:410px}
.eca-role-points{position:relative;z-index:2;display:grid;gap:9px;margin-top:auto}
.eca-role-points span{font-size:10px;color:#bfc5e2}.eca-role-points b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;background:rgba(255,255,255,.09);color:#fff;margin-left:7px}
.eca-auth-panel{padding:44px 58px;display:grid;align-items:center}
.eca-card{width:min(520px,100%);margin:auto}
.eca-card h2{font-size:31px;color:var(--eca-ink,#100659);margin:6px 0 9px}
.eca-card-lead{font-size:11px;color:#777285;line-height:1.9;margin:0 0 19px}
.eca-card form{display:grid;gap:13px}
.eca-card label>span{display:block;font-size:11px;font-weight:800;color:#5e596f;margin-bottom:6px}
.eca-card input[type=text],.eca-card input[type=email],.eca-card input[type=password],.eca-card input[type=tel],.eca-card input[type=url]{width:100%;border:1px solid #dadee8;border-radius:13px;padding:13px 14px;font-family:inherit;font-size:13px;outline:none;background:#fcfcfe;transition:.15s}
.eca-card input:focus{border-color:var(--eca-primary,#245BE8);box-shadow:0 0 0 3px color-mix(in srgb,var(--eca-primary,#245BE8) 10%,transparent);background:#fff}
.eca-btn{appearance:none;border:0;border-radius:13px;padding:13px 18px;font-family:inherit;font-size:12px;font-weight:900;text-decoration:none!important;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.eca-btn-primary{background:var(--eca-primary,#245BE8);color:#fff!important;box-shadow:0 9px 24px color-mix(in srgb,var(--eca-primary,#245BE8) 24%,transparent)}
.eca-btn-primary:hover{filter:brightness(.96)}
.eca-form-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10px}
.eca-form-row>a,.eca-switch a,.eca-text-link{color:var(--eca-primary,#245BE8)!important;text-decoration:none!important;font-weight:800}
.eca-check{display:flex!important;align-items:center;gap:7px;font-size:10px;color:#6c6778}.eca-check input{margin:0}
.eca-tabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:5px;background:#f1f2f7;border-radius:14px;margin:19px 0 17px}
.eca-tabs button{border:0;background:transparent;border-radius:10px;padding:10px;font-family:inherit;font-weight:800;color:#716c7f;cursor:pointer}
.eca-tabs button.active{background:#fff;color:var(--eca-ink,#100659);box-shadow:0 4px 14px rgba(25,22,60,.07)}
.eca-tab-panel{display:none}.eca-tab-panel.active{display:block}
.eca-switch{text-align:center;border-top:1px solid #eceef3;margin-top:19px;padding-top:16px;font-size:11px;color:#7b7687}
.eca-alert{width:min(520px,100%);margin:0 auto 15px;border-radius:13px;padding:11px 13px;font-size:11px;line-height:1.8}
.eca-alert.error{background:#fff0f0;border:1px solid #f0c9c9;color:#9a3e3e}
.eca-alert.success{background:#eef9f2;border:1px solid #c8e5d1;color:#357151}
.eca-debug-code{background:#fff8e9;border:1px solid #f0dab1;color:#765c2b;border-radius:12px;padding:10px 12px;margin:12px 0;font-size:11px}
.eca-debug-code b{font-size:18px;letter-spacing:2px;margin-right:5px}
.eca-otp-input{text-align:center;font-size:26px!important;letter-spacing:5px;direction:ltr}
.eca-role-select{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.eca-role-select label{display:block;cursor:pointer}
.eca-role-select input{position:absolute;opacity:0;pointer-events:none}
.eca-role-select label>span{height:100%;display:flex;flex-direction:column;gap:3px;border:1px solid #e1e3eb;border-radius:13px;padding:11px;background:#fcfcfe;transition:.15s}
.eca-role-select label>span b{font-size:11px;color:#373247}.eca-role-select label>span small{font-size:9px;color:#878291;line-height:1.6}
.eca-role-select input:checked+span{border-color:var(--eca-primary,#245BE8);background:color-mix(in srgb,var(--eca-primary,#245BE8) 6%,#fff);box-shadow:0 0 0 2px color-mix(in srgb,var(--eca-primary,#245BE8) 8%,transparent)}
.eca-already{width:min(520px,100%);background:#fff;border:1px solid #e2e4ec;border-radius:24px;padding:30px;text-align:center;display:grid;gap:14px;box-shadow:0 20px 60px rgba(25,22,60,.10)}
.eca-already h1{color:var(--eca-ink,#100659);font-size:28px;margin:0}

@media(max-width:900px){
  .eca-auth-shell{grid-template-columns:1fr;min-height:auto}
  .eca-auth-brand{min-height:320px;padding:30px}
  .eca-brand-copy{margin:35px 0}
  .eca-brand-copy h1{font-size:34px}
  .eca-role-points{display:none}
  .eca-auth-panel{padding:34px 28px}
}
@media(max-width:560px){
  .eca-auth-page{padding:12px}
  .eca-auth-shell{border-radius:24px 7px 24px 7px}
  .eca-auth-brand{min-height:240px;padding:24px}
  .eca-brand-copy h1{font-size:29px}
  .eca-auth-panel{padding:28px 20px}
  .eca-card h2{font-size:26px}
  .eca-role-select{grid-template-columns:1fr}
}

.eca-role-locked{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 15px;margin:0 0 15px;border:1px solid rgba(36,91,232,.16);background:rgba(36,91,232,.05);border-radius:14px}
.eca-role-locked small{color:#777b8d}.eca-role-locked strong{color:var(--eca-ink)}


/* =========================================================
   ESLCAMP Auth 0.1.4 — UX refinement
   ========================================================= */
.eca-auth-shell{max-width:1180px}
.eca-auth-brand{min-height:650px}
.eca-card{padding:42px 48px}
.eca-card h2{font-size:30px;line-height:1.55;margin:8px 0 10px}
.eca-card-lead{font-size:13px;line-height:2;color:#7b8092}
.eca-steps{display:flex;gap:7px;flex-wrap:wrap;margin:2px 0 18px}
.eca-steps span{font-size:10px;color:#9298aa;background:#f5f6fa;border:1px solid #e8ebf2;padding:6px 9px;border-radius:999px}
.eca-steps span.is-active{background:#edf2ff;color:#254bb7;border-color:#d8e2ff;font-weight:800}
.eca-card form{display:grid;gap:15px}
.eca-card label>span{font-size:12px;color:#555b70}
.eca-card input:not([type=checkbox]),.eca-card select{min-height:48px;border-radius:12px;border:1px solid #dce1eb;background:#fff}
.eca-card input:not([type=checkbox]):focus,.eca-card select:focus{border-color:#4f68df;box-shadow:0 0 0 4px rgba(79,104,223,.10)}
.eca-password-wrap{position:relative;display:flex;align-items:center}
.eca-password-wrap input{width:100%;padding-left:72px!important}
.eca-password-toggle{position:absolute;left:8px;border:0;background:#f1f3f8;color:#5c647a;border-radius:8px;padding:6px 10px;font-family:inherit;font-size:11px;cursor:pointer}
.eca-form-hint,.eca-submit-help{font-size:11px;color:#8c91a2;line-height:1.8;margin-top:-4px}
.eca-btn-primary{background:linear-gradient(135deg,#245BE8,#1F43C4)!important;color:#fff!important;border:0!important;min-height:50px;font-weight:800;box-shadow:0 10px 24px rgba(36,91,232,.20);opacity:1!important}
.eca-btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 14px 30px rgba(36,91,232,.26)}
.eca-btn-primary:disabled,.eca-btn-primary.is-disabled{background:#d8dce7!important;color:#8d94a8!important;box-shadow:none!important;cursor:not-allowed;opacity:1!important}
.eca-alert.eca-error{background:#fff3f3;color:#a33a3a;border-color:#ffd5d5}
@media(max-width:900px){
  .eca-auth-brand{min-height:300px}
  .eca-card{padding:32px 26px}
}
@media(max-width:600px){
  .eca-card{padding:25px 18px}
  .eca-steps{gap:5px}
  .eca-steps span{font-size:9px;padding:5px 7px}
}


/* =========================================================
   ESLCAMP Auth 0.1.6 — role visuals / physical LTR layout
   ========================================================= */
.eca-auth-shell{
  direction:ltr;
  grid-template-columns:44% 56%;
  border-radius:30px;
}
.eca-auth-brand,
.eca-auth-panel{
  direction:rtl;
}
.eca-auth-brand{
  min-height:690px;
  padding:34px;
  background-image:
    linear-gradient(rgba(0,0,0,.05),rgba(0,0,0,.12)),
    var(--eca-role-image);
  background-size:cover;
  background-position:center center;
  color:#fff;
  isolation:isolate;
}
.eca-auth-brand:before,
.eca-auth-brand:after{
  display:none;
}
.eca-visual-overlay{
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(180deg,
      color-mix(in srgb,var(--eca-role) calc(var(--eca-overlay) * 100%),transparent) 0%,
      rgba(10,14,45,.05) 42%,
      rgba(10,14,45,.72) 100%);
}
.eca-brand-link{
  align-items:flex-start;
  text-shadow:0 2px 12px rgba(0,0,0,.22);
}
.eca-brand-link small{color:rgba(255,255,255,.86)}
.eca-visual-copy{
  margin-top:auto;
  position:relative;
  z-index:2;
  max-width:390px;
  padding:22px 20px;
  border-radius:20px;
  background:rgba(15,18,50,.28);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  text-shadow:0 2px 12px rgba(0,0,0,.22);
}
.eca-visual-copy>span{
  display:inline-block;
  color:#fff;
  background:var(--eca-role);
  border-radius:999px;
  padding:6px 10px;
  font-size:10px;
  font-weight:900;
  margin-bottom:10px;
}
.eca-visual-copy h1{
  color:#fff;
  margin:0 0 9px;
  font-size:31px;
  line-height:1.55;
}
.eca-visual-copy p{
  color:rgba(255,255,255,.9);
  margin:0;
  font-size:12px;
  line-height:2;
}
.eca-auth-panel{
  background:#fff;
  padding:44px 52px;
}
.eca-card{
  padding:20px 10px;
}
@media(max-width:900px){
  .eca-auth-shell{grid-template-columns:1fr}
  .eca-auth-panel{grid-row:1;padding:30px 24px}
  .eca-auth-brand{
    grid-row:2;
    min-height:340px;
    background-position:center 35%;
  }
  .eca-visual-copy{max-width:520px}
}
@media(max-width:560px){
  .eca-auth-page{padding:10px}
  .eca-auth-shell{border-radius:22px}
  .eca-auth-panel{padding:24px 16px}
  .eca-auth-brand{min-height:270px;padding:20px}
  .eca-visual-copy{padding:16px}
  .eca-visual-copy h1{font-size:24px}
}


/* =========================================================
   ESLCAMP Auth 0.1.7 — final visual polish
   ========================================================= */
.eca-auth-panel{
  display:flex;
  align-items:center;
}
.eca-auth-panel>.eca-card{
  width:100%;
  max-width:560px;
  margin:0 auto;
}
.eca-brand-link{
  position:relative;
  z-index:3;
  width:auto;
  display:inline-flex;
}
.eca-brand-link img{
  max-width:150px;
  max-height:54px;
  object-fit:contain;
}
.eca-brand-link strong{
  font-size:30px;
}
.eca-visual-copy{
  max-width:360px;
  padding:16px 18px;
  border-radius:17px;
  background:rgba(12,16,48,.42);
}
.eca-visual-copy>span{
  padding:5px 9px;
  margin-bottom:8px;
}
.eca-visual-copy h1{
  font-size:27px;
  margin-bottom:7px;
}
.eca-visual-copy p{
  font-size:11px;
  line-height:1.85;
}
.eca-card .eca-btn-primary:not(:disabled){
  background:var(--eca-role)!important;
  box-shadow:0 10px 24px color-mix(in srgb,var(--eca-role) 28%,transparent)!important;
}
.eca-card .eca-btn-primary:not(:disabled):hover{
  filter:brightness(.96);
  transform:translateY(-1px);
  box-shadow:0 14px 30px color-mix(in srgb,var(--eca-role) 34%,transparent)!important;
}
.eca-card .eca-btn-primary:disabled{
  background:#d9dde7!important;
  color:#8f96a7!important;
}
.eca-auth-tabs button.is-active{
  color:var(--eca-role)!important;
  box-shadow:inset 0 -2px 0 var(--eca-role),0 2px 10px rgba(31,42,78,.05);
}
.eca-auth-card h2,
.eca-card h2{
  margin-bottom:8px;
}
.eca-card-lead{
  margin-bottom:18px;
}
@media(max-width:900px){
  .eca-auth-panel{
    display:block;
  }
  .eca-auth-panel>.eca-card{
    max-width:none;
  }
  .eca-visual-copy{
    max-width:480px;
  }
}


/* =========================================================
   ESLCAMP Auth 0.1.8 — Alert layout fix
   ========================================================= */

/*
 * The auth panel previously used CSS Grid. When an alert and the registration
 * card were both present, they could be laid out as separate grid items in a
 * way that visually pushed the warning beside the form. Treat the panel as one
 * vertical stack instead.
 */
.eca-auth-panel{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:stretch!important;
}

/* Alerts now align with the exact width of the auth card. */
.eca-auth-panel>.eca-alert{
  width:min(520px,100%)!important;
  box-sizing:border-box!important;
  margin:0 auto 14px!important;
  flex:0 0 auto!important;
}

/* Keep the card aligned under the alert instead of beside it. */
.eca-auth-panel>.eca-card{
  width:min(520px,100%)!important;
  margin:0 auto!important;
  flex:0 0 auto!important;
}

/* Make validation messages easier to scan without disrupting form rhythm. */
.eca-alert{
  text-align:right;
  font-size:11px;
  line-height:1.85;
  padding:11px 14px;
  border-radius:13px;
}

@media(max-width:560px){
  .eca-auth-panel>.eca-alert,
  .eca-auth-panel>.eca-card{
    width:100%!important;
  }
}

/* ESLCAMP Auth 0.1.9 security feedback */
.eca-alert.security{background:#fff8e9;border:1px solid #f2d7a4;color:#765321}

/* ESLCAMP Auth 0.2.0 — clearer OTP eligibility + agreements */
.eca-otp-existing-note{background:#f6f8ff;border:1px solid #dfe6ff;border-radius:14px;padding:13px 14px;margin-bottom:14px}
.eca-otp-existing-note strong{display:block;color:#171159;font-size:12px}.eca-otp-existing-note p{margin:5px 0 7px;color:#73798b;font-size:10px;line-height:1.9}.eca-otp-existing-note a{font-size:10px;font-weight:900;color:#245be8;text-decoration:none}
.eca-existing-confirm{margin:2px 0 10px!important;padding:10px 12px;border:1px solid #e3e6ee;border-radius:11px;background:#fbfcff}
.eca-legal-consent{display:grid;gap:9px;margin:12px 0}.eca-legal-consent .eca-check{align-items:flex-start!important;line-height:1.8!important;background:#fbfcff;border:1px solid #e4e7ef;border-radius:11px;padding:10px!important}.eca-legal-consent a{font-weight:900;color:#245be8;text-decoration:none}.eca-teacher-financial-consent{background:#fff8f3!important;border-color:#f2dfd1!important}

.eca-teacher-financial-consent.is-hidden{display:none!important}


/* Auth 0.2.5 — cleaner teacher registration */
.eca-register-title{
  margin:0 0 18px!important;
  color:#171159!important;
  font-size:30px!important;
  line-height:1.55!important;
  font-weight:900!important;
  text-align:right!important;
}
.eca-steps-large{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0 0 20px!important;
}
.eca-steps-large span{
  min-height:72px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  padding:10px 8px!important;
  border:1px solid #dfe4ef!important;
  border-radius:15px!important;
  background:#f8f9fd!important;
  color:#646a7b!important;
  text-align:center!important;
  font-style:normal!important;
}
.eca-steps-large span b{
  width:28px!important;
  height:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%!important;
  background:#e8eaf3!important;
  color:#4f5467!important;
  font-size:12px!important;
}
.eca-steps-large span em{
  font-style:normal!important;
  font-size:11px!important;
  font-weight:800!important;
}
.eca-steps-large span.is-active{
  border-color:#171159!important;
  background:#f0efff!important;
  color:#171159!important;
  box-shadow:0 7px 20px rgba(23,17,89,.08)!important;
}
.eca-steps-large span.is-active b{
  background:#171159!important;
  color:#fff!important;
}
.eca-teacher-identity{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}
.eca-teacher-identity>label:last-of-type{
  grid-column:1/-1!important;
}
@media(max-width:640px){
  .eca-register-title{font-size:25px!important}
  .eca-steps-large{gap:6px!important}
  .eca-steps-large span{min-height:66px!important;padding:8px 5px!important}
  .eca-steps-large span em{font-size:9px!important}
  .eca-teacher-identity{grid-template-columns:1fr!important}
  .eca-teacher-identity>label:last-of-type{grid-column:auto!important}
}


/* Auth 0.2.6 — teacher registration validation + compact password visibility */
.eca-password-wrap input{
  padding-left:46px!important;
}
.eca-password-toggle{
  position:absolute!important;
  left:7px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#7d8395!important;
  box-shadow:none!important;
}
.eca-password-toggle:hover{
  background:#f2f4f8!important;
  color:#171159!important;
}
.eca-password-toggle svg{
  width:20px!important;
  height:20px!important;
  fill:currentColor!important;
  pointer-events:none!important;
}
.eca-password-toggle.is-visible{
  color:#245be8!important;
}
.eca-field-error{
  display:block;
  min-height:0;
  margin-top:5px;
  color:#b3261e!important;
  font-size:10px!important;
  line-height:1.7!important;
}
.eca-field-error:empty{display:none}
.eca-card input.eca-invalid{
  border-color:#d74941!important;
  box-shadow:0 0 0 3px rgba(215,73,65,.08)!important;
}
.eca-registration-summary-error{
  min-height:0;
  color:#a8322c;
  font-size:11px;
  font-weight:700;
  line-height:1.8;
}
.eca-registration-summary-error:empty{display:none}
.eca-check input.eca-invalid-check{
  outline:2px solid #d74941;
  outline-offset:2px;
}
.eca-teacher-identity input[name="national_id"],
.eca-card input[name="mobile"]{
  direction:ltr!important;
  text-align:left!important;
}


/* Auth 0.2.9 — cleaner ESLCAMP entry experience */
.eca-auth-shell{
  max-width:1180px!important;
  border-radius:28px!important;
  overflow:hidden!important;
  box-shadow:0 24px 70px rgba(18,24,58,.12)!important;
}
.eca-auth-panel{
  padding:42px 42px 48px!important;
}
.eca-card{
  max-width:560px!important;
  margin-inline:auto!important;
}
.eca-card h2,.eca-register-title{
  letter-spacing:-.02em;
}
.eca-tabs{
  padding:5px!important;
  border:1px solid #e7e9f1!important;
  border-radius:14px!important;
  background:#f7f8fb!important;
}
.eca-tabs button{
  border-radius:10px!important;
  min-height:42px!important;
  font-weight:750!important;
}
.eca-tabs button.active{
  background:#fff!important;
  box-shadow:0 4px 18px rgba(23,17,89,.08)!important;
}
.eca-role-locked{
  border-radius:14px!important;
  border:1px solid rgba(23,17,89,.09)!important;
  background:linear-gradient(135deg,#f8f8ff,#f3fbff)!important;
}
.eca-role-select label span{
  border-radius:16px!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}
.eca-role-select label:hover span{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(23,17,89,.08);
}
.eca-card input,.eca-card select,.eca-card textarea{
  border-radius:12px!important;
}
.eca-btn-primary{
  min-height:48px!important;
  border-radius:12px!important;
  font-weight:800!important;
}
.eca-otp-existing-note{
  border-radius:14px!important;
  background:#f8fbff!important;
  border:1px solid #dfeaf7!important;
}
@media(max-width:760px){
  .eca-auth-panel{padding:26px 18px 34px!important}
  .eca-auth-shell{border-radius:0!important}
}


/* ESLCAMP Auth 0.3.0 — role-specific clarity and readable forms */
.eca-auth-page{padding:28px 18px!important}
.eca-auth-shell{max-width:1160px!important;min-height:660px!important;border-radius:30px!important;border:1px solid #e8eaf1!important;box-shadow:0 30px 90px rgba(16,6,89,.13)!important}
.eca-auth-panel{padding:46px 54px!important;background:linear-gradient(180deg,#fff,#fcfcff)!important}
.eca-card{max-width:570px!important;padding:16px 8px!important}
.eca-card h2,.eca-register-title{font-size:32px!important;line-height:1.45!important;letter-spacing:-.5px!important;color:#100659!important}
.eca-card-lead{font-size:13px!important;line-height:2!important;color:#6e7385!important}
.eca-card label>span{font-size:12px!important;font-weight:800!important;color:#4f5568!important}
.eca-card input:not([type=checkbox]),.eca-card select{font-size:14px!important;min-height:50px!important;border-radius:13px!important}
.eca-role-locked{padding:14px 16px!important;border-radius:14px!important;background:linear-gradient(135deg,color-mix(in srgb,var(--eca-role) 8%,#fff),#fff)!important;border-color:color-mix(in srgb,var(--eca-role) 25%,#e9ebf1)!important}
.eca-role-locked strong{color:var(--eca-role)!important}
.eca-tabs{margin:20px 0!important;border:1px solid #e5e8ef!important;background:#f5f6f9!important}
.eca-tabs button{font-size:12px!important;min-height:43px!important}
.eca-tabs button.active{color:var(--eca-role)!important;box-shadow:0 5px 16px rgba(20,25,70,.08)!important}
.eca-otp-existing-note{font-size:12px!important;line-height:1.9!important;padding:14px!important}
.eca-switch{font-size:12px!important;padding-top:18px!important}
.eca-switch a{font-weight:900!important}
.eca-btn-primary{font-size:13px!important;min-height:50px!important;border-radius:13px!important}
.eca-auth-page[data-eslcamp-auth-role="institute"] .eca-card h2{color:#8c4529!important}
.eca-auth-page[data-eslcamp-auth-role="institute"] .eca-role-locked strong,
.eca-auth-page[data-eslcamp-auth-role="institute"] .eca-switch a,
.eca-auth-page[data-eslcamp-auth-role="institute"] .eca-form-row>a{color:#d56642!important}
.eca-auth-page[data-eslcamp-auth-role="institute"] .eca-card input:focus{border-color:#e8725d!important;box-shadow:0 0 0 4px rgba(232,114,93,.10)!important}
@media(max-width:900px){.eca-auth-panel{padding:32px 26px!important}.eca-auth-shell{min-height:auto!important}}
@media(max-width:560px){.eca-auth-page{padding:8px!important}.eca-auth-panel{padding:25px 17px!important}.eca-card h2,.eca-register-title{font-size:27px!important}.eca-card{padding:8px 0!important}}


/* Auth 0.3.1 — larger, calmer Persian login/registration UI */
.eca-auth-page{background:linear-gradient(125deg,#edf7ff,#f7f4ff)!important}
.eca-auth-shell{max-width:1240px!important;border-radius:30px!important;box-shadow:0 24px 65px rgba(26,42,84,.10)!important}
.eca-auth-panel{padding:48px 46px 52px!important}.eca-card{max-width:590px!important}.eca-card h1,.eca-card h2,.eca-register-title{font-size:clamp(30px,3.2vw,42px)!important;line-height:1.45!important;letter-spacing:-.5px!important}.eca-card-lead{font-size:15px!important;line-height:2!important;color:#6a7083!important}.eca-kicker{font-size:12px!important}.eca-card label>span{font-size:14px!important;font-weight:780!important}.eca-card input,.eca-card select,.eca-card textarea{min-height:50px!important;font-size:16px!important;padding:12px 14px!important;border-radius:13px!important}.eca-check{font-size:13px!important}.eca-btn{font-size:15px!important;min-height:50px!important}.eca-tabs button{font-size:14px!important}.eca-switch{font-size:13px!important}.eca-otp-existing-note strong{font-size:14px!important}.eca-otp-existing-note p{font-size:13px!important;line-height:1.9!important}
@media(max-width:760px){.eca-auth-panel{padding:28px 18px 36px!important}.eca-card h1,.eca-card h2,.eca-register-title{font-size:30px!important}}


/* 1.10.2 mobile registration hardening */
.eca-auth-page input[type="password"],
.eca-auth-page input[type="password"]::placeholder{
  direction:rtl!important;
  text-align:right!important;
}
@media (max-width:900px){
  body.eslcamp-auth-active #colophon.site-footer,
  body.eslcamp-auth-active footer.site-footer,
  body.eslcamp-auth-active .studiare-footer,
  body.eslcamp-auth-active .footer-widgets-wrap,
  body.eslcamp-auth-active .footer-bottom,
  body.eslcamp-auth-active .footer-wrapper{
    display:none!important;
  }
}

/* 0.3.5 — hard shell isolation on mobile/desktop auth routes. */
body.eslcamp-auth-ui > footer,
body.eslcamp-auth-ui #colophon,
body.eslcamp-auth-ui .site-footer,
body.eslcamp-auth-ui .footer,
body.eslcamp-auth-ui #footer,
body.eslcamp-auth-ui .footer-widgets,
body.eslcamp-auth-ui .studiare-footer,
body.eslcamp-auth-ui .stm-footer,
body.eslcamp-auth-active > footer,
body.eslcamp-auth-active #colophon,
body.eslcamp-auth-active .site-footer,
body.eslcamp-auth-active .footer,
body.eslcamp-auth-active #footer,
body.eslcamp-auth-active .footer-widgets,
body.eslcamp-auth-active .studiare-footer,
body.eslcamp-auth-active .stm-footer { display:none !important; }

.eca-inline-error{margin:.35rem 0 .65rem;color:#b42318;font-size:.88rem;font-weight:700}
.eca-field-invalid input,.eca-field-invalid select,.eca-field-invalid textarea{border-color:#d92d20!important;box-shadow:0 0 0 3px rgba(217,45,32,.08)!important}

@media(max-width:600px){
 .eca-auth-page[data-eslcamp-auth-role="teacher"]{display:block;padding:12px;min-height:100dvh}
 .eca-auth-page[data-eslcamp-auth-role="teacher"] .eca-auth-shell{width:100%;min-height:0;grid-template-columns:minmax(0,1fr);border-radius:18px;box-shadow:none}
 .eca-auth-page[data-eslcamp-auth-role="teacher"] .eca-auth-brand{padding:20px;min-height:0}
 .eca-auth-page[data-eslcamp-auth-role="teacher"] .eca-auth-panel{padding:20px 16px;min-width:0}
 .eca-auth-page[data-eslcamp-auth-role="teacher"] input:not([type=checkbox]):not([type=radio]),.eca-auth-page[data-eslcamp-auth-role="teacher"] select{font-size:16px;min-width:0;max-width:100%}
 .eca-auth-page[data-eslcamp-auth-role="teacher"] .eca-auth-shell>*{min-width:0}
}

/* Auth 0.4.0 — universal home return on Student / Teacher / Institute auth */
.eca-home-return{
  display:inline-flex!important;align-items:center!important;gap:7px!important;
  margin:0 0 14px!important;padding:8px 11px!important;border-radius:999px!important;
  border:1px solid #e3e7ef!important;background:#fff!important;color:#4f5870!important;
  text-decoration:none!important;font-size:12px!important;font-weight:850!important;
  box-shadow:0 5px 16px rgba(31,45,84,.045)!important
}
.eca-home-return:hover{color:var(--eca-role)!important;border-color:color-mix(in srgb,var(--eca-role) 35%,#e3e7ef)!important}
@media(max-width:600px){
  .eca-home-return{margin-bottom:10px!important;padding:7px 10px!important;font-size:11px!important}
}
/* 0.4.1: regulatory SMS suffix can prevent strict WebOTP; keep manual/autocomplete fallback obvious. */
.eca-otp-help{display:block;margin:-2px 0 14px;color:#777d8f;font-size:11px;line-height:1.9}
/* 0.4.1: Student registration uses real first/last name fields, not a public nickname. */
.eca-student-identity{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important}
.eca-student-identity.is-hidden,
.eca-teacher-identity.is-hidden,
[data-eca-institute-name].is-hidden{display:none!important}
@media(max-width:640px){.eca-student-identity{grid-template-columns:1fr!important}}

.eca-otp-paste{margin-top:8px;border:0;background:transparent;color:var(--eca-role,#245BE8);font:inherit;font-weight:800;cursor:pointer;padding:6px 0}

/* 0.4.5-beta — actionable registration steps + 120s resend */
.eca-steps a,.eca-steps button,.eca-steps span{font:inherit;color:inherit;text-decoration:none}
.eca-steps a,.eca-steps button{cursor:pointer}
.eca-steps button{border:0;background:transparent;padding:0}
.eca-steps .is-disabled{opacity:.58;cursor:not-allowed}
.eca-otp-resend{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 4px;padding:10px 12px;border-radius:12px;background:#f8f7ff;color:#59556c;font-size:12px}
.eca-resend-submit{border:0;background:transparent;color:var(--eca-role,#5c3eb8);font:inherit;font-weight:900;cursor:pointer;padding:5px 0}
.eca-resend-submit:disabled{color:#9a97a8;cursor:not-allowed}
@media(max-width:560px){.eca-otp-resend{align-items:flex-start;flex-direction:column;gap:5px}.eca-resend-submit{min-height:36px}}

/* 0.4.6-beta: unified clickable registration step cards + verified-step review. */
.eca-steps-large > :is(span,a,button){min-width:0;min-height:72px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:5px!important;padding:10px 8px!important;border:1px solid #dfe4ef!important;border-radius:15px!important;background:#f8f9fd!important;color:#646a7b!important;text-align:center!important;font-style:normal!important;box-sizing:border-box!important}
.eca-steps-large > :is(span,a,button) b{width:28px!important;height:28px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:50%!important;background:#e8eaf3!important;color:#4f5467!important;font-size:12px!important}
.eca-steps-large > :is(span,a,button) em{font-style:normal!important;font-size:11px!important;font-weight:800!important}
.eca-steps-large > :is(span,a,button).is-active{border-color:#171159!important;background:#f0efff!important;color:#171159!important;box-shadow:0 7px 20px rgba(23,17,89,.08)!important}
.eca-steps-large > :is(span,a,button).is-active b{background:#171159!important;color:#fff!important}
.eca-steps-large > :is(a,button).is-done{border-color:#b7a4e6!important;color:#53389e!important}
.eca-steps-large > :is(a,button):focus-visible{outline:2px solid #7a4fd3;outline-offset:2px}
.eca-steps-large .is-disabled{pointer-events:none!important;opacity:.52}
.eca-verified-review{display:grid;gap:12px;padding:16px;border-radius:14px;background:#f8f7ff;margin:15px 0;color:#171159;line-height:1.8}
[data-eca-step-panel][hidden]{display:none!important}
@media(max-width:640px){.eca-steps-large > :is(span,a,button){min-height:66px!important;padding:8px 5px!important}.eca-steps-large > :is(span,a,button) em{font-size:9px!important}}

/* 0.4.7 Mobile registration cards: consistent sizes regardless of link/button type. */
.eca-card .eca-steps.eca-steps-large{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;direction:rtl!important;width:100%!important;align-items:stretch!important;justify-content:stretch!important;flex-wrap:nowrap!important;margin:10px 0 19px!important}
.eca-card .eca-steps.eca-steps-large>:is(span,a,button){min-width:0!important;max-width:none!important;width:100%!important;min-height:76px!important;box-sizing:border-box!important;margin:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:7px!important;padding:8px 4px!important;line-height:1.3!important;position:static!important;transform:none!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;direction:rtl!important}
.eca-card .eca-steps.eca-steps-large>:is(span,a,button) b{width:29px!important;height:29px!important;flex:none!important;display:grid!important;place-items:center!important;border-radius:50%!important;margin:0!important;line-height:1!important;position:static!important}
.eca-card .eca-steps.eca-steps-large>:is(span,a,button) em{display:block!important;font-size:clamp(9px,2.6vw,12px)!important;line-height:1.45!important;text-align:center!important;font-weight:900!important;font-style:normal!important;white-space:normal!important}
@media(max-width:390px){.eca-card .eca-steps.eca-steps-large{gap:5px!important}.eca-card .eca-steps.eca-steps-large>:is(span,a,button){padding:7px 3px!important}.eca-card .eca-steps.eca-steps-large>:is(span,a,button) em{font-size:9px!important}}


/* ESLCAMP 1.11.1 — isolated OTP digit cells (registration / login / recovery). */
.eca-card .eca-otp-boxes{display:block!important;position:relative!important;max-width:430px!important;width:100%!important;min-width:0!important;margin:12px auto 5px!important;cursor:text!important;direction:ltr!important}
.eca-card .eca-otp-cells{display:grid!important;grid-template-columns:repeat(var(--eca-otp-count,6),minmax(0,1fr))!important;gap:clamp(4px,1.5vw,9px)!important;width:100%!important;direction:ltr!important;pointer-events:none!important}
.eca-card .eca-otp-cell{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;min-width:0!important;height:clamp(45px,11vw,66px)!important;border:1.5px solid #dbe4ee!important;background:#f8f9fc!important;border-radius:13px!important;font-family:inherit!important;font-size:clamp(19px,5vw,29px)!important;font-weight:800!important;line-height:1!important;color:#11164d!important;box-sizing:border-box!important;transition:border-color .12s,background .12s,box-shadow .12s!important}
.eca-card .eca-otp-cell.is-current{border-color:#245be9!important;background:#fff!important;box-shadow:0 0 0 3px rgba(36,91,233,.12)!important}
.eca-card .eca-otp-cell.is-filled{background:#eef5ff!important}
.eca-card .eca-otp-boxes input.eca-otp-input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:.01!important;z-index:2!important;display:block!important;min-height:0!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;font-size:20px!important;direction:ltr!important;letter-spacing:0!important;cursor:text!important;caret-color:transparent!important;appearance:none!important;color:transparent!important;background:transparent!important}
.eca-card .eca-otp-boxes input.eca-otp-input:focus{outline:none!important;box-shadow:none!important}
@media(max-width:360px){.eca-card .eca-otp-cell{border-radius:10px!important}.eca-card .eca-otp-cells{gap:4px!important}}