/* e-Kurikulum V1.4 - Login Mobile-First V4 */
:root{
  --ek-blue:#2563eb;
  --ek-blue-2:#1d4ed8;
  --ek-cyan:#0ea5a8;
  --ek-ink:#12284a;
  --ek-text:#334155;
  --ek-muted:#64748b;
  --ek-border:#d8e4f5;
  --ek-bg:#f5f9ff;
  --ek-card:#ffffff;
}
html,body{min-height:100%;}
body.ek-login-modern{
  margin:0!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  font-family:"Segoe UI",Inter,Arial,sans-serif!important;
  color:var(--ek-ink)!important;
  background:
    radial-gradient(circle at 8% 8%,rgba(37,99,235,.10),transparent 28%),
    radial-gradient(circle at 92% 92%,rgba(14,165,168,.10),transparent 28%),
    linear-gradient(180deg,#eef5ff 0%,#f7fbff 55%,#f1fcfc 100%)!important;
  overflow-x:hidden!important;
}
/* hide any leftover top-level legacy blocks outside shell */
body.ek-login-modern > :not(.ek-login-shell):not(script):not(style):not(link){display:none!important;}
.ek-login-shell{
  min-height:100vh;
  min-height:100dvh;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(460px,.95fr);
  align-items:stretch;
  isolation:isolate;
  position:relative;
}
.ek-login-shell::before,.ek-login-shell::after{
  content:"";position:absolute;z-index:-1;border-radius:999px;pointer-events:none;
}
.ek-login-shell::before{width:360px;height:360px;top:-180px;left:-120px;background:rgba(37,99,235,.08);}
.ek-login-shell::after{width:500px;height:500px;right:-220px;bottom:-250px;background:rgba(14,165,168,.09);}
.ek-login-visual{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(42px,5vw,84px);
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(240,247,255,.88));
  overflow:hidden;
}
.ek-login-visual::before{
  content:"";position:absolute;inset:0;opacity:.42;pointer-events:none;
  background-image:radial-gradient(circle,rgba(37,99,235,.18) 1.4px,transparent 1.7px);
  background-size:22px 22px;
  mask-image:linear-gradient(to bottom,black,transparent 62%);
}
.ek-visual-copy{position:relative;z-index:2;max-width:640px;}
.ek-eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;
  font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#0f7e98;
}
.ek-eyebrow::before{content:"";width:28px;height:3px;border-radius:99px;background:linear-gradient(90deg,var(--ek-blue),var(--ek-cyan));}
.ek-visual-title{margin:0;color:#173b7f;font-size:clamp(36px,4vw,60px);line-height:1.05;letter-spacing:-.03em;font-weight:800;}
.ek-visual-title span{color:var(--ek-blue);}
.ek-visual-desc{margin:18px 0 0;max-width:580px;font-size:clamp(15px,1.2vw,18px);line-height:1.75;color:#526681;}
.ek-visual-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;}
.ek-visual-tag{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:999px;border:1px solid rgba(37,99,235,.16);background:rgba(255,255,255,.74);font-size:12px;font-weight:700;color:#365b99;backdrop-filter:blur(8px);}
.ek-visual-tag svg{width:15px;height:15px;color:var(--ek-blue);}
.ek-visual-image-wrap{position:relative;min-height:320px;display:flex;align-items:flex-end;justify-content:flex-start;z-index:1;}
.ek-visual-image{width:min(100%,920px);max-height:52vh;object-fit:contain;object-position:left bottom;filter:drop-shadow(0 20px 30px rgba(20,60,130,.16));}
.ek-login-pane{
  display:flex;align-items:center;justify-content:center;position:relative;
  padding:32px clamp(24px,4vw,68px);
  background:rgba(247,250,255,.74);backdrop-filter:blur(12px);
  border-left:1px solid rgba(208,220,238,.78);
}
.ek-login-pane::before{
  content:"";position:absolute;right:7%;top:7%;width:96px;height:96px;opacity:.26;
  background-image:radial-gradient(circle,var(--ek-blue) 1.6px,transparent 1.8px);background-size:13px 13px;
}
.ek-login-card{
  width:100%!important;max-width:510px!important;min-width:0!important;
  margin:0!important;background:rgba(255,255,255,.97)!important;border:1px solid rgba(218,229,245,.92)!important;
  border-radius:30px!important;box-shadow:0 26px 70px rgba(34,72,132,.14)!important;overflow:hidden!important;
}
.ek-login-card .card-body{padding:clamp(28px,4vw,46px)!important;}
.ek-login-card img{max-width:112px!important;height:auto!important;display:block!important;margin-inline:auto!important;}
.ek-login-card h1,.ek-login-card h2,.ek-login-card h3,.ek-login-card h4{color:#102a58!important;letter-spacing:-.02em;}
.ek-login-card label,.ek-login-card .form-label{font-weight:700!important;color:#263954!important;}
.ek-login-card .badge{border-radius:999px!important;padding:.4em .72em!important;}
.ek-login-card .alert{border-radius:16px!important;padding:14px 16px!important;}
.ek-login-card input.form-control,
.ek-login-card input[type="text"],
.ek-login-card input[type="password"]{
  width:100%!important;min-height:52px!important;border-radius:14px!important;border:1px solid var(--ek-border)!important;
  background:#fbfdff!important;box-shadow:none!important;font-size:16px!important;transition:.2s ease!important;
}
.ek-login-card input.form-control:focus,
.ek-login-card input[type="text"]:focus,
.ek-login-card input[type="password"]:focus{
  border-color:#7cabff!important;box-shadow:0 0 0 4px rgba(37,99,235,.10)!important;background:#fff!important;
}
.ek-login-card .ek-input-username,.ek-login-card .ek-input-password{
  padding-left:44px!important;background-repeat:no-repeat!important;background-position:14px center!important;background-size:18px!important;
}
.ek-login-card .ek-input-username{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23758ba9' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.5 20.118a7.5 7.5 0 0115 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.5-1.632z'/%3E%3C/svg%3E")!important;}
.ek-login-card .ek-input-password{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23758ba9' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 0h10.5A2.25 2.25 0 0119.5 12.75v6A2.25 2.25 0 0117.25 21H6.75A2.25 2.25 0 014.5 18.75v-6a2.25 2.25 0 012.25-2.25z'/%3E%3C/svg%3E")!important;}
.ek-login-card button[type="submit"],
.ek-login-card input[type="submit"],
.ek-login-card .btn-primary{
  width:100%!important;min-height:52px!important;border:0!important;border-radius:14px!important;
  background:linear-gradient(135deg,var(--ek-blue),var(--ek-blue-2))!important;color:#fff!important;
  font-weight:800!important;box-shadow:0 12px 24px rgba(37,99,235,.20)!important;transition:.2s ease!important;
}
.ek-login-card button[type="submit"]:hover,.ek-login-card .btn-primary:hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(37,99,235,.26)!important;}
.ek-login-card .btn-outline-primary,.ek-login-card .btn-outline-secondary{
  width:100%!important;min-height:48px!important;border-radius:14px!important;border-color:#90b7ff!important;color:#175fd8!important;background:#fff!important;font-weight:700!important;
}
.ek-login-card hr{border-color:#e9eff8!important;opacity:1!important;}
.ek-login-card .text-muted{color:#718096!important;}
.ek-login-card a{transition:.2s ease;}
.ek-login-card .row{margin-left:0!important;margin-right:0!important;}
.ek-login-card .row>[class*="col-"]{padding-left:0!important;padding-right:0!important;}
.ek-login-mini-brand,.ek-mobile-footnote{display:none!important;}
.ek-login-orphan{display:none!important;}

/* tablet */
@media (max-width:1100px){
  .ek-login-shell{grid-template-columns:minmax(0,.9fr) minmax(400px,1fr);}
  .ek-login-visual{padding:38px 28px 28px;}
  .ek-visual-title{font-size:42px;}
  .ek-visual-desc{font-size:15px;line-height:1.6;}
  .ek-visual-tags{display:none;}
  .ek-visual-image{width:110%;max-height:44vh;}
}

/* mobile-first refined layout */
@media (max-width:767px){
  body.ek-login-modern{
    background:
      radial-gradient(circle at 10% 6%,rgba(37,99,235,.10),transparent 25%),
      radial-gradient(circle at 90% 94%,rgba(14,165,168,.12),transparent 24%),
      linear-gradient(180deg,#eef4ff 0%,#f8fbff 55%,#effcfc 100%)!important;
  }
  .ek-login-shell{
    display:block!important;min-height:100vh;min-height:100dvh;padding:0!important;
  }
  .ek-login-shell::before{width:220px;height:220px;top:-120px;left:-100px;}
  .ek-login-shell::after{width:280px;height:280px;right:-150px;bottom:-150px;}
  .ek-login-visual{display:none!important;}
  .ek-login-pane{
    min-height:100vh;min-height:100dvh;padding:16px!important;border-left:0!important;background:transparent!important;backdrop-filter:none!important;
    align-items:center;justify-content:center;
  }
  .ek-login-pane::before{display:none!important;}
  .ek-login-card{
    width:min(100%,430px)!important;max-width:100%!important;border-radius:26px!important;
    box-shadow:0 18px 46px rgba(40,81,145,.14)!important;
  }
  .ek-login-card .card-body{padding:24px 20px!important;}
  .ek-login-card img{max-width:82px!important;}
  .ek-login-card .alert{font-size:14px!important;line-height:1.55!important;}
}
@media (max-width:520px){
  .ek-login-pane{padding:12px!important;}
  .ek-login-card{width:100%!important;border-radius:24px!important;}
  .ek-login-card .card-body{padding:22px 18px!important;}
}
@media (max-width:390px){
  .ek-login-pane{padding:10px!important;}
  .ek-login-card{border-radius:22px!important;}
  .ek-login-card .card-body{padding:20px 16px!important;}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;}}
