:root{
  --sg-navy:#15347b;
  --sg-navy-deep:#0a1d4d;
  --sg-navy-mid:#102b69;
  --sg-orange:#f39a3d;
  --sg-orange-light:#ffb35d;
  --sg-ink:#17213a;
  --sg-muted:#748099;
  --sg-line:#dbe3ef;
  --sg-bg:#eef3f9;
  --sg-white:#ffffff;
  --sg-shadow:0 28px 80px rgba(10,29,77,.14);
}

*{box-sizing:border-box}
html{direction:rtl;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body.sg-login-page{
  margin:0;
  min-height:100vh;
  min-height:100dvh;
  display:grid;
  place-items:center;
  padding:28px;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 12% 12%,rgba(243,154,61,.10),transparent 28%),
    radial-gradient(circle at 88% 88%,rgba(21,52,123,.10),transparent 30%),
    var(--sg-bg);
  color:var(--sg-ink);
  font-family:"Segoe UI",Tahoma,Arial,sans-serif;
  line-height:1.8;
  text-align:right;
}

button,input{font:inherit}

.sg-login-shell{
  width:min(1040px,100%);
  min-height:590px;
  display:grid;
  grid-template-columns:minmax(330px,.88fr) minmax(430px,1.12fr);
  background:var(--sg-white);
  border:1px solid rgba(21,52,123,.10);
  border-radius:28px;
  overflow:hidden;
  box-shadow:var(--sg-shadow);
}

.sg-login-brand{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:38px;
  color:#fff;
  background:linear-gradient(150deg,var(--sg-navy-deep) 0%,var(--sg-navy-mid) 58%,#234797 100%);
}
.sg-login-brand::before{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  left:-120px;
  bottom:-120px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  box-shadow:0 0 0 48px rgba(255,255,255,.015),0 0 0 96px rgba(255,255,255,.010);
  pointer-events:none;
}
.sg-login-brand::after{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  left:-45px;
  top:92px;
  border-radius:50%;
  background:rgba(243,154,61,.12);
  filter:blur(2px);
  pointer-events:none;
}
.sg-login-brand>*{position:relative;z-index:1}

.sg-login-lockup{display:flex;align-items:center;gap:13px}
.sg-login-logo{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:17px;
  background:#fff;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.sg-login-logo img{display:block;width:48px;height:48px;padding:3px}
.sg-login-lockup-copy{display:grid;gap:2px;line-height:1.5}
.sg-login-lockup-copy strong{font-size:15px;font-weight:850}
.sg-login-lockup-copy small{direction:ltr;unicode-bidi:isolate;font-size:8px;letter-spacing:1px;color:#bdcae8}

.sg-login-brand-copy{margin-block:auto;padding-block:58px}
.sg-login-eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  color:#ffd09a;
  font-size:10px;
  font-weight:900;
}
.sg-login-brand-copy h1{
  max-width:410px;
  margin:18px 0 10px;
  color:#fff;
  font-size:clamp(34px,4vw,50px);
  line-height:1.45;
  letter-spacing:-1px;
}
.sg-login-brand-copy p{max-width:400px;margin:0;color:#cad5ed;font-size:12px;line-height:2.05}
.sg-login-brand-note{display:flex;align-items:center;gap:9px;color:#c6d2eb;font-size:10px}
.sg-login-brand-note i{display:block;width:30px;height:2px;border-radius:99px;background:var(--sg-orange)}

.sg-login-form-panel{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:54px 64px;
  background:#fff;
}
.sg-login-form-wrap{width:min(430px,100%)}
.sg-login-mobile-brand{display:none;align-items:center;gap:11px;margin-bottom:30px}
.sg-login-mobile-brand .sg-login-logo{width:50px;height:50px;flex-basis:50px;border:1px solid var(--sg-line);box-shadow:none}
.sg-login-mobile-brand .sg-login-logo img{width:42px;height:42px}
.sg-login-mobile-brand>div{display:grid;line-height:1.5}
.sg-login-mobile-brand strong{font-size:14px;color:var(--sg-navy-deep)}
.sg-login-mobile-brand small{font-size:9px;color:var(--sg-muted)}

.sg-login-heading{margin-bottom:28px}
.sg-login-heading>span{display:block;margin-bottom:6px;color:var(--sg-orange);font-size:10px;font-weight:900}
.sg-login-heading h2{margin:0;color:var(--sg-navy-deep);font-size:34px;line-height:1.45;letter-spacing:-.5px}
.sg-login-heading p{margin:7px 0 0;color:var(--sg-muted);font-size:11px;line-height:1.9}

.sg-login-error{
  margin-bottom:17px;
  padding:11px 13px;
  border:1px solid #efc4c8;
  border-right:4px solid #d84b55;
  border-radius:12px;
  background:#fff4f5;
  color:#a52e37;
  font-size:10px;
  line-height:1.8;
}

.sg-login-form{display:grid;gap:17px}
.sg-login-field{display:grid;gap:7px}
.sg-login-field>label{color:#46536b;font-size:11px;font-weight:800}
.sg-login-field input[type="text"],
.sg-login-field input[type="password"],
.sg-login-field input[type="email"]{
  width:100%;
  min-height:52px;
  margin:0;
  border:1px solid #d8e0ed;
  border-radius:13px;
  outline:none;
  background:#f9fbfd;
  color:var(--sg-ink);
  padding:11px 14px;
  font-size:12px;
  transition:border-color .18s,box-shadow .18s,background .18s;
}
.sg-login-field input::placeholder{color:#a8b1c1}
.sg-login-field input:focus{
  border-color:#7089c5;
  background:#fff;
  box-shadow:0 0 0 4px rgba(21,52,123,.08);
}
.sg-login-field .errorlist{list-style:none;margin:0;padding:0;color:#c9424d;font-size:9px}

.sg-login-password{position:relative}
.sg-login-password input{padding-left:78px!important}
.sg-login-password-toggle{
  position:absolute;
  left:7px;
  top:7px;
  bottom:7px;
  min-width:64px;
  border:0;
  border-radius:9px;
  background:#eaf0f8;
  color:var(--sg-navy);
  font-size:9px;
  font-weight:900;
  cursor:pointer;
  transition:background .18s,transform .18s;
}
.sg-login-password-toggle:hover{background:#dfe7f4}
.sg-login-password-toggle:active{transform:scale(.98)}

.sg-login-options{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sg-login-remember{display:flex;align-items:center;gap:8px;color:#68758c;font-size:10px;cursor:pointer}
.sg-login-remember input{width:16px;height:16px;margin:0;accent-color:var(--sg-navy)}
.sg-login-secure{display:inline-flex;align-items:center;gap:7px;color:#8a95a8;font-size:9px;white-space:nowrap}
.sg-login-secure::before{content:"";width:7px;height:7px;border-radius:50%;background:#20a676;box-shadow:0 0 0 4px rgba(32,166,118,.10)}

.sg-login-submit{
  width:100%;
  min-height:52px;
  border:0;
  border-radius:13px;
  background:linear-gradient(135deg,var(--sg-orange-light),var(--sg-orange));
  color:#fff;
  box-shadow:0 12px 26px rgba(243,154,61,.24);
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  transition:transform .18s,box-shadow .18s,filter .18s;
}
.sg-login-submit:hover{transform:translateY(-1px);box-shadow:0 15px 30px rgba(243,154,61,.28);filter:saturate(1.03)}
.sg-login-submit:disabled{opacity:.7;cursor:wait;transform:none}
.sg-login-help{margin:19px 0 0;padding-top:17px;border-top:1px solid #edf1f6;text-align:center;color:#98a2b4;font-size:9px;line-height:1.8}

@media(max-width:980px){
  body.sg-login-page{padding:20px}
  .sg-login-shell{grid-template-columns:minmax(300px,.8fr) minmax(390px,1.2fr);min-height:560px}
  .sg-login-brand{padding:30px}
  .sg-login-form-panel{padding:45px 42px}
}

@media(max-width:780px){
  body.sg-login-page{padding:0;background:#f5f7fb}
  .sg-login-shell{width:100%;min-height:100vh;min-height:100dvh;display:block;border:0;border-radius:0;box-shadow:none}
  .sg-login-brand{display:none}
  .sg-login-form-panel{min-height:100vh;min-height:100dvh;padding:34px 24px}
  .sg-login-mobile-brand{display:flex}
}

@media(max-width:480px){
  .sg-login-form-panel{padding:28px 18px}
  .sg-login-heading{margin-bottom:24px}
  .sg-login-heading h2{font-size:30px}
  .sg-login-options{align-items:flex-start;flex-direction:column-reverse;gap:9px}
}

/* ========================================================================== 
   Login readability pass — 2026-09-15
   ========================================================================== */
body.sg-login-page{font-size:15px}
.sg-login-lockup-copy strong{font-size:16px}
.sg-login-lockup-copy small{font-size:10px}
.sg-login-eyebrow{font-size:11.5px}
.sg-login-brand-copy p{font-size:13.5px}
.sg-login-brand-note{font-size:11.5px}
.sg-login-mobile-brand strong{font-size:15px}
.sg-login-mobile-brand small{font-size:10.5px}
.sg-login-heading>span{font-size:11.5px}
.sg-login-heading p{font-size:13px}
.sg-login-error{font-size:11.5px}
.sg-login-field>label{font-size:13px}
.sg-login-field input[type="text"],
.sg-login-field input[type="password"],
.sg-login-field input[type="email"]{font-size:14px}
.sg-login-field .errorlist{font-size:10.5px}
.sg-login-password-toggle{font-size:10.5px}
.sg-login-remember{font-size:11.5px}
.sg-login-secure{font-size:10.5px}
.sg-login-submit{font-size:14px}
.sg-login-help{font-size:10.5px}

/* ========================================================================== 
   Login readability pass V2 — 2026-09-15
   ========================================================================== */
.sg-login-lockup-copy small{font-size:11.5px}
.sg-login-eyebrow{font-size:12px}
.sg-login-brand-copy p{font-size:14px}
.sg-login-brand-note{font-size:12px}
.sg-login-mobile-brand small{font-size:11.5px}
.sg-login-heading>span{font-size:12px}
.sg-login-heading p{font-size:13.5px}
.sg-login-error{font-size:12px}
.sg-login-field>label{font-size:13.5px}
.sg-login-field input[type="text"],
.sg-login-field input[type="password"],
.sg-login-field input[type="email"]{font-size:14.5px}
.sg-login-field .errorlist{font-size:11.5px}
.sg-login-password-toggle{font-size:11.5px}
.sg-login-remember{font-size:12px}
.sg-login-secure{font-size:11.5px}
.sg-login-submit{font-size:14px}
.sg-login-help{font-size:11.5px}
