/* EPR 2026 V023 — Enterprise Split Login Visual Fidelity */
:root{
  --login-navy:#071f43;
  --login-navy-deep:#041937;
  --login-blue:#0d63e8;
  --login-blue-hover:#0758d5;
  --login-text:#111827;
  --login-muted:#5f6b7a;
  --login-line:#dfe5ec;
  --login-soft:#f6f8fb;
  --login-white:#fff;
  --login-success:#12b76a;
  --login-danger:#b42318;
  --login-warning:#8a4b08;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Segoe UI",Tahoma,Arial,"Noto Sans Thai",sans-serif;color:var(--login-text);background:#fff}
body.epr2026-login{min-height:100vh;overflow-x:hidden;background:#fff}
.epr2026-login .login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(420px,42%) minmax(0,58%);background:#fff}

/* Left brand panel — follows approved concept 1 */
.epr2026-login .login-brand-panel{
  position:relative;min-height:100vh;padding:52px 50px 36px;display:flex;flex-direction:column;
  overflow:hidden;color:#fff;background:
    radial-gradient(circle at 86% 70%,rgba(20,91,196,.16),transparent 26%),
    linear-gradient(145deg,var(--login-navy) 0%,var(--login-navy-deep) 100%);
}
.epr2026-login .login-brand-panel:before{
  content:"";position:absolute;right:28px;bottom:80px;width:260px;height:170px;opacity:.24;pointer-events:none;
  background:
    linear-gradient(90deg,transparent 0 15%,rgba(33,105,209,.32) 15% 17%,transparent 17% 40%,rgba(33,105,209,.25) 40% 42%,transparent 42% 100%),
    linear-gradient(0deg,rgba(33,105,209,.18) 0 2%,transparent 2% 22%,rgba(33,105,209,.15) 22% 24%,transparent 24% 100%);
  clip-path:polygon(0 100%,0 78%,13% 78%,13% 54%,27% 54%,27% 72%,42% 72%,42% 44%,58% 44%,58% 64%,69% 64%,69% 34%,86% 34%,86% 80%,100% 80%,100% 100%);
}
.epr2026-login .login-brand-panel:after{
  content:"";position:absolute;right:58px;top:32%;width:180px;height:180px;pointer-events:none;opacity:.55;
  border-top:4px solid rgba(22,92,200,.45);transform:rotate(-29deg) skewX(-12deg);border-radius:50%;
}
.epr2026-login .login-brand-lockup{position:relative;z-index:2;display:flex;align-items:center;gap:13px}
.epr2026-login .login-product-mark{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:9px;background:#fff;color:#0a2448;font-size:13px;font-weight:850;box-shadow:0 2px 8px rgba(0,0,0,.08)}.epr2026-login .login-product-mark img{padding:4px}
.epr2026-login .login-brand-name strong,.epr2026-login .login-brand-name span{display:block}
.epr2026-login .login-brand-name strong{font-size:16px;line-height:1.2;font-weight:750;letter-spacing:-.01em}
.epr2026-login .login-brand-name span{margin-top:2px;color:rgba(255,255,255,.76);font-size:11.5px;font-weight:500}
.epr2026-login .login-brand-copy{position:relative;z-index:2;margin:auto 0;transform:translateY(-2%);max-width:430px}
.epr2026-login .login-brand-copy h1{margin:0 0 14px;color:#fff;font-size:clamp(28px,2vw,34px);line-height:1.12;font-weight:720;letter-spacing:-.028em}
.epr2026-login .login-brand-copy>p{margin:0;color:rgba(255,255,255,.82);font-size:14px;line-height:1.5;font-weight:450}
.epr2026-login .login-feature-list{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:13px}
.epr2026-login .login-feature-list li{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.88);font-size:12.5px;font-weight:500}
.epr2026-login .login-check{display:inline-grid;place-items:center;width:15px;height:15px;color:var(--login-success);font-size:14px;font-weight:900;line-height:1}
.epr2026-login .login-brand-footer{position:relative;z-index:2;margin-top:auto;color:rgba(255,255,255,.72);font-size:10.5px;font-weight:450}

/* Right access panel — centered like approved mockup */
.epr2026-login .login-access-panel{position:relative;min-height:100vh;display:grid;place-items:center;padding:52px 54px;background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);overflow:hidden}
.epr2026-login .login-dot-pattern{position:absolute;right:7%;top:3%;width:230px;height:135px;opacity:.7;pointer-events:none;background-image:radial-gradient(circle,#d9e2ee 1.5px,transparent 1.7px);background-size:14px 14px;mask-image:linear-gradient(135deg,rgba(0,0,0,.75),transparent 78%);-webkit-mask-image:linear-gradient(135deg,rgba(0,0,0,.75),transparent 78%)}
.epr2026-login .login-card{position:relative;z-index:1;width:min(430px,100%);display:flex;flex-direction:column;align-items:center;text-align:center;background:transparent;border:0;box-shadow:none}
.epr2026-login .login-company-logo{width:120px;margin:0 auto 30px;display:flex;justify-content:center;align-items:center}
.epr2026-login .login-company-logo img{display:block;width:100%;height:auto}
.epr2026-login .login-copy h2{margin:0;color:#101828;font-size:29px;line-height:1.15;font-weight:760;letter-spacing:-.025em}
.epr2026-login .login-copy p{margin:7px 0 25px;color:#344054;font-size:13.5px;line-height:1.45;font-weight:450}
.epr2026-login .ms-login{width:100%;min-height:48px;padding:10px 18px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #0b5ed8;border-radius:5px;background:linear-gradient(180deg,#1169ef 0%,var(--login-blue) 100%);color:#fff;text-decoration:none;font-size:13.5px;font-weight:700;box-shadow:0 2px 5px rgba(13,99,232,.16);transition:background .15s ease,box-shadow .15s ease,transform .15s ease}
.epr2026-login .ms-login:hover:not(.disabled){background:linear-gradient(180deg,#0d62e3 0%,var(--login-blue-hover) 100%);box-shadow:0 6px 15px rgba(13,99,232,.22);transform:translateY(-1px)}
.epr2026-login .ms-login:focus-visible{outline:0;box-shadow:0 0 0 4px rgba(13,99,232,.18)}
.epr2026-login .ms-login.disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}
.epr2026-login .ms-mark{display:grid;grid-template-columns:repeat(2,7px);grid-template-rows:repeat(2,7px);gap:1.5px}
.epr2026-login .ms-mark i{display:block;width:7px;height:7px;background:#fff}
.epr2026-login .login-alert{width:100%;display:flex;flex-direction:column;gap:4px;margin:-7px 0 16px;padding:11px 13px;border-radius:7px;text-align:left;font-size:11.5px;line-height:1.45}
.epr2026-login .login-alert.error{background:#fff1f0;border:1px solid #f7c7c2;color:var(--login-danger)}
.epr2026-login .login-alert.warning{background:#fff7e8;border:1px solid #f0d6a5;color:var(--login-warning)}
.epr2026-login .login-security{width:100%;margin-top:23px;color:#667085;text-align:center}
.epr2026-login .login-security-divider{display:grid;grid-template-columns:1fr 34px 1fr;align-items:center;gap:7px;margin-bottom:13px}
.epr2026-login .login-security-divider>span{height:1px;background:var(--login-line)}
.epr2026-login .login-lock{position:relative;width:26px;height:26px;display:grid;place-items:center;margin:auto;border:0;color:#667085}
.epr2026-login .login-lock:before{content:"";width:10px;height:8px;border:1.6px solid currentColor;border-radius:1.5px;position:absolute;bottom:4px}
.epr2026-login .login-lock:after{content:"";width:7px;height:7px;border:1.6px solid currentColor;border-bottom:0;border-radius:7px 7px 0 0;position:absolute;top:4px}
.epr2026-login .login-security strong,.epr2026-login .login-security small{display:block}
.epr2026-login .login-security strong{color:#344054;font-size:11.5px;font-weight:700}
.epr2026-login .login-security small{margin-top:3px;color:#7d8997;font-size:10.8px;line-height:1.4}
.epr2026-login .login-version{position:absolute;right:6.5%;bottom:28px;color:#475467;font-size:10.5px;font-weight:600}

@media (max-width: 1050px){
  .epr2026-login .login-shell{grid-template-columns:minmax(360px,40%) minmax(0,60%)}
  .epr2026-login .login-brand-panel{padding:42px 38px 32px}
  .epr2026-login .login-brand-copy h1{font-size:29px}
  .epr2026-login .login-access-panel{padding:46px 38px}
  .epr2026-login .login-card{width:min(400px,100%)}
}

@media (max-width: 760px){
  body.epr2026-login{background:#f4f6f9}
  .epr2026-login .login-shell{display:block;min-height:100vh;background:#f4f6f9;padding:18px}
  .epr2026-login .login-brand-panel{min-height:auto;padding:0;background:transparent;display:flex;align-items:center;justify-content:center;color:#0a2448;overflow:visible}
  .epr2026-login .login-brand-panel:before,.epr2026-login .login-brand-panel:after,.epr2026-login .login-brand-copy,.epr2026-login .login-brand-footer{display:none}
  .epr2026-login .login-brand-lockup{display:none}
  .epr2026-login .login-access-panel{min-height:calc(100vh - 36px);padding:26px 18px;background:transparent;display:grid;place-items:center;overflow:visible}
  .epr2026-login .login-dot-pattern{display:none}
  .epr2026-login .login-card{width:min(390px,100%);padding:32px 24px 26px;border:1px solid #e3e8ef;border-radius:10px;background:#fff;box-shadow:0 8px 26px rgba(16,24,40,.07)}
  .epr2026-login .login-company-logo{width:105px}
  .epr2026-login .login-copy h2{font-size:25px}
  .epr2026-login .login-copy p{font-size:12.5px}
  .epr2026-login .ms-login{min-height:46px;font-size:12.8px}
  .epr2026-login .login-version{position:static;margin-top:18px;color:#667085;font-size:10px}
}

@media (max-width: 430px){
  .epr2026-login .login-shell{padding:10px}
  .epr2026-login .login-access-panel{min-height:calc(100vh - 20px);padding:14px 8px}
  .epr2026-login .login-card{padding:28px 18px 22px}
  .epr2026-login .login-company-logo{width:96px;margin-bottom:24px}
  .epr2026-login .login-copy h2{font-size:23px}
  .epr2026-login .login-security{margin-top:20px}
}

/* V064 — independent EPR Local Account provider */
.epr2026-login .local-login-form{width:100%;display:grid;gap:10px;padding:15px;border:1px solid #dfe6ef;border-radius:9px;background:#fbfcfe;text-align:left}
.epr2026-login .local-login-title{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:1px}.epr2026-login .local-login-title strong{color:#173b63;font-size:12.5px}.epr2026-login .local-login-title span{color:#7b8798;font-size:10.5px}
.epr2026-login .local-login-field{display:grid;gap:5px}.epr2026-login .local-login-field>span{color:#4c5f76;font-size:11.5px;font-weight:700}.epr2026-login .local-login-field input{width:100%;height:41px;border:1px solid #cfd8e4;border-radius:7px;background:#fff;color:#17243a;padding:0 11px;font:inherit;font-size:13px;outline:0}.epr2026-login .local-login-field input:focus{border-color:#79a9ef;box-shadow:0 0 0 3px rgba(31,111,235,.09)}
.epr2026-login .local-login-submit{height:42px;margin-top:2px;border:1px solid #173b63;border-radius:7px;background:#173b63;color:#fff;display:flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:12.5px;font-weight:750;cursor:pointer}.epr2026-login .local-login-submit:hover{background:#0f3156;border-color:#0f3156}.epr2026-login .local-login-submit:focus-visible{outline:0;box-shadow:0 0 0 4px rgba(23,59,99,.16)}
.epr2026-login .login-provider-divider{width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin:15px 0}.epr2026-login .login-provider-divider span{height:1px;background:#e1e7ee}.epr2026-login .login-provider-divider b{color:#98a2b3;font-size:9px;letter-spacing:.08em}
@media (max-width: 760px){.epr2026-login .local-login-form{padding:13px}.epr2026-login .login-company-logo{margin-bottom:20px}.epr2026-login .login-copy p{margin-bottom:18px}}

/* V368 — approval deep links authenticate before review/decision. */
.login-approval-required{display:flex;align-items:flex-start;gap:10px;margin:0 0 14px;padding:11px 12px;border:1px solid #b9d6f5;border-radius:10px;background:#f2f8ff;color:#173f6b;text-align:left}.login-approval-required-icon{flex:0 0 28px;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:#176cc6;color:#fff;font-weight:900}.login-approval-required>div{display:grid;gap:3px}.login-approval-required strong{font-size:12px}.login-approval-required span{font-size:10px;line-height:1.45;color:#5a728b}.login-approval-required em{font-style:normal;color:#73879b}