:root{
  --ey-blue:#0649c9;
  --ey-blue-dark:#053aa2;
  --ey-orange:#ff7900;
  --ey-ink:#17233c;
  --ey-muted:#6d7688;
  --ey-line:#dce5f4;
}

html.eyfiber-login-html,
body.eyfiber-login{
  width:100%!important;
  min-height:100%!important;
  margin:0!important;
  overflow-x:hidden!important;
  background:
    radial-gradient(circle at 18% 13%,rgba(35,117,255,.20),transparent 24%),
    radial-gradient(circle at 77% 6%,rgba(64,141,255,.11),transparent 27%),
    linear-gradient(135deg,#eaf3ff 0%,#fff 48%,#f5f8ff 100%)!important;
  font-family:Arial,Helvetica,sans-serif!important;
}

body.eyfiber-login::before,
body.eyfiber-login::after{
  content:"";
  position:fixed;
  pointer-events:none;
  border-radius:50%;
  border:1px solid rgba(30,102,220,.12);
  z-index:0;
}
body.eyfiber-login::before{
  width:900px;height:900px;
  right:-480px;top:-590px;
  box-shadow:
    0 0 0 38px rgba(37,105,220,.025),
    0 0 0 78px rgba(37,105,220,.02),
    0 0 0 118px rgba(37,105,220,.015);
}
body.eyfiber-login::after{
  width:900px;height:900px;
  right:-590px;bottom:-650px;
  box-shadow:
    0 0 0 42px rgba(37,105,220,.025),
    0 0 0 90px rgba(37,105,220,.02);
}

body.eyfiber-login > .fixed.top-0.left-0,
body.eyfiber-login > .fixed.bottom-0.right-0,
body.eyfiber-login .fixed.top-0.left-0,
body.eyfiber-login .fixed.bottom-0.right-0{
  display:none!important;
}

body.eyfiber-login .login-body{
  position:relative!important;
  z-index:2!important;
  min-height:100vh!important;
  width:100vw!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(390px,.75fr)!important;
  background:transparent!important;
  padding:0 0 105px!important;
  overflow:visible!important;
}

body.eyfiber-login .ey-brand-side{
  grid-column:1!important;
  grid-row:1!important;
  min-height:calc(100vh - 105px)!important;
  display:flex!important;
  align-items:center!important;
  padding:55px 40px 40px 88px!important;
  position:relative!important;
  z-index:5!important;
}

body.eyfiber-login .ey-brand-wrap{
  width:min(820px,100%)!important;
}
body.eyfiber-login .ey-logo{
  display:inline-grid!important;
  grid-template-columns:auto auto!important;
  line-height:.88!important;
  position:relative!important;
  margin-bottom:46px!important;
}
body.eyfiber-login .ey-logo::after{
  content:"";
  position:absolute;
  left:0;bottom:-15px;
  width:39%;height:3px;
  background:var(--ey-orange);
  transform:skewX(-28deg);
  border-radius:8px;
}
body.eyfiber-login .ey-logo-ey{
  color:var(--ey-blue)!important;
  font-size:clamp(68px,6.2vw,104px)!important;
  font-weight:900!important;
  letter-spacing:-.08em!important;
}
body.eyfiber-login .ey-logo-fiber{
  color:var(--ey-orange)!important;
  font-size:clamp(68px,6.2vw,104px)!important;
  font-weight:800!important;
  letter-spacing:-.07em!important;
}
body.eyfiber-login .ey-logo-telecom{
  grid-column:2!important;
  color:var(--ey-orange)!important;
  text-align:center!important;
  font-size:clamp(17px,1.55vw,27px)!important;
  font-weight:700!important;
  letter-spacing:.28em!important;
  padding-top:9px!important;
}
body.eyfiber-login .ey-kicker{
  margin:0 0 12px!important;
  color:var(--ey-orange)!important;
  font-weight:800!important;
  font-size:12px!important;
  letter-spacing:.18em!important;
}
body.eyfiber-login .ey-welcome{
  margin:0 0 14px!important;
  color:var(--ey-blue)!important;
  font-size:clamp(49px,5vw,80px)!important;
  line-height:1!important;
  letter-spacing:-.05em!important;
}
body.eyfiber-login .ey-subtitle{
  margin:0!important;
  color:#424a58!important;
  font-size:clamp(22px,2.05vw,31px)!important;
  line-height:1.28!important;
}
body.eyfiber-login .ey-subtitle strong{color:var(--ey-blue)!important}

body.eyfiber-login .ey-services{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(104px,1fr))!important;
  gap:13px!important;
  margin-top:38px!important;
  width:min(760px,100%)!important;
}
body.eyfiber-login .ey-service{
  min-height:145px!important;
  background:rgba(255,255,255,.84)!important;
  border:1px solid rgba(7,73,199,.08)!important;
  border-radius:22px!important;
  box-shadow:0 12px 30px rgba(35,85,160,.08)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  color:var(--ey-blue)!important;
}
body.eyfiber-login .ey-service-icon{
  width:55px;height:55px;
  border:2px solid var(--ey-blue);
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  font-weight:800;
}
body.eyfiber-login .ey-service strong{
  color:var(--ey-blue)!important;
  font-size:17px!important;
}
body.eyfiber-login .ey-service::after{
  content:"";
  width:28px;height:3px;
  background:var(--ey-orange);
  border-radius:4px;
}

/* Preserve the original DoWISP/React branch containing the real form. */
body.eyfiber-login .ey-login-branch{
  grid-column:2!important;
  grid-row:1!important;
  width:100%!important;
  max-width:none!important;
  min-height:calc(100vh - 105px)!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:transparent!important;
  overflow:visible!important;
  position:relative!important;
  inset:auto!important;
}

body.eyfiber-login .ey-hide-original{
  display:none!important;
}

body.eyfiber-login .login-panel{
  width:min(440px,calc(100% - 44px))!important;
  max-width:440px!important;
  min-width:0!important;
  max-height:none!important;
  margin:0 48px 0 12px!important;
  padding:38px!important;
  border:1px solid rgba(6,73,201,.09)!important;
  border-radius:28px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 24px 70px rgba(19,58,125,.18)!important;
  overflow:visible!important;
  backdrop-filter:blur(18px)!important;
}

body.eyfiber-login .logo-container,
body.eyfiber-login .ey-domain-field,
body.eyfiber-login .ey-hide-link{
  display:none!important;
}

body.eyfiber-login .ey-mobile-logo{
  display:none;
}

body.eyfiber-login .ey-login-kicker{
  display:block!important;
  text-align:center!important;
  color:var(--ey-orange)!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.18em!important;
  margin:0 0 8px!important;
}
body.eyfiber-login .login-panel h2{
  text-align:center!important;
  color:var(--ey-blue)!important;
  font-size:31px!important;
  font-weight:700!important;
  letter-spacing:-.035em!important;
  margin:0 0 8px!important;
}
body.eyfiber-login .ey-login-description{
  text-align:center!important;
  color:var(--ey-muted)!important;
  font-size:14px!important;
  margin:0 0 25px!important;
}

body.eyfiber-login .login-panel label{
  color:var(--ey-ink)!important;
  font-size:13px!important;
  font-weight:700!important;
}
body.eyfiber-login .login-panel .p-inputgroup,
body.eyfiber-login .login-panel .p-password{
  border-radius:13px!important;
}
body.eyfiber-login .login-panel input,
body.eyfiber-login .login-panel .p-inputtext,
body.eyfiber-login .login-panel .p-password-input{
  min-height:48px!important;
  border-radius:0 13px 13px 0!important;
}
body.eyfiber-login .login-panel .p-inputgroup-addon{
  color:var(--ey-blue)!important;
  background:#fff!important;
  border-color:var(--ey-line)!important;
}
body.eyfiber-login .login-panel input:focus,
body.eyfiber-login .login-panel .p-inputtext:focus{
  border-color:rgba(6,73,201,.55)!important;
  box-shadow:0 0 0 3px rgba(6,73,201,.08)!important;
}

body.eyfiber-login #submit-button{
  width:100%!important;
  min-height:50px!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  background:linear-gradient(90deg,var(--ey-blue),#0b55d8 68%,#1970e9)!important;
  box-shadow:0 11px 26px rgba(6,73,201,.22)!important;
  font-weight:800!important;
}
body.eyfiber-login #submit-button .p-button-label{
  color:#fff!important;
}
body.eyfiber-login .recaptcha-field a{
  color:var(--ey-blue)!important;
  font-size:13px!important;
}
body.eyfiber-login .ey-support{
  margin-top:22px!important;
  padding-top:19px!important;
  border-top:1px solid #e7edf7!important;
  text-align:center!important;
  color:var(--ey-muted)!important;
  font-size:12px!important;
}
body.eyfiber-login .ey-support a{
  color:var(--ey-blue)!important;
  font-weight:700!important;
}

/* Corporate footer only on login */
body.eyfiber-login .ey-footer{
  position:fixed!important;
  left:0;right:0;bottom:0;
  min-height:100px;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  color:#fff;
  background:linear-gradient(8deg,var(--ey-blue-dark),var(--ey-blue));
  border-top:5px solid var(--ey-orange);
  clip-path:polygon(0 31%,34% 27%,69% 13%,100% 0,100% 100%,0 100%);
  padding:26px 28px 16px;
}
body.eyfiber-login .ey-footer a{
  color:#fff!important;
  text-decoration:none!important;
  font-size:22px!important;
  font-weight:800!important;
}
body.eyfiber-login .ey-footer-sep{
  height:34px;width:2px;background:var(--ey-orange);
}
body.eyfiber-login .ey-footer-mark{
  color:var(--ey-orange);
  font-size:28px;
  font-weight:800;
}

@media(max-width:1100px){
  body.eyfiber-login .login-body{
    grid-template-columns:1fr 430px!important;
  }
  body.eyfiber-login .ey-brand-side{padding-left:42px!important;padding-right:25px!important}
  body.eyfiber-login .login-panel{margin-right:30px!important}
  body.eyfiber-login .ey-services{grid-template-columns:repeat(3,1fr)!important;max-width:530px!important}
  body.eyfiber-login .ey-service:nth-child(4),
  body.eyfiber-login .ey-service:nth-child(5){display:none!important}
}

@media(max-width:850px){
  body.eyfiber-login .login-body{
    display:block!important;
    padding:22px 16px 95px!important;
  }
  body.eyfiber-login .ey-brand-side{display:none!important}
  body.eyfiber-login .ey-login-branch{
    width:100%!important;
    min-height:calc(100vh - 117px)!important;
    display:flex!important;
  }
  body.eyfiber-login .login-panel{
    width:min(460px,100%)!important;
    max-width:460px!important;
    margin:auto!important;
    padding:32px 27px!important;
    border-radius:25px!important;
  }
  body.eyfiber-login .ey-mobile-logo{
    display:grid!important;
    grid-template-columns:auto auto!important;
    width:max-content!important;
    margin:0 auto 29px!important;
    line-height:.88!important;
    position:relative!important;
  }
  body.eyfiber-login .ey-mobile-logo::after{
    content:"";
    position:absolute;
    left:0;bottom:-10px;
    width:39%;height:2px;
    background:var(--ey-orange);
  }
  body.eyfiber-login .ey-mobile-logo .ey-logo-ey,
  body.eyfiber-login .ey-mobile-logo .ey-logo-fiber{font-size:52px!important}
  body.eyfiber-login .ey-mobile-logo .ey-logo-telecom{font-size:13px!important;padding-top:7px!important}
  body.eyfiber-login .ey-footer{min-height:86px!important}
  body.eyfiber-login .ey-footer a{font-size:18px!important}
}

@media(max-width:520px){
  body.eyfiber-login .login-body{padding:14px 10px 80px!important}
  body.eyfiber-login .ey-login-branch{min-height:calc(100vh - 94px)!important}
  body.eyfiber-login .login-panel{
    width:100%!important;
    padding:25px 17px 22px!important;
    border-radius:21px!important;
    box-shadow:0 17px 48px rgba(18,58,126,.16)!important;
  }
  body.eyfiber-login .ey-mobile-logo{margin-bottom:24px!important}
  body.eyfiber-login .ey-mobile-logo .ey-logo-ey,
  body.eyfiber-login .ey-mobile-logo .ey-logo-fiber{font-size:43px!important}
  body.eyfiber-login .ey-mobile-logo .ey-logo-telecom{font-size:11px!important}
  body.eyfiber-login .login-panel h2{font-size:27px!important}
  body.eyfiber-login .ey-footer{
    min-height:74px!important;
    gap:12px!important;
    padding:20px 10px 10px!important;
  }
  body.eyfiber-login .ey-footer a{font-size:14px!important}
  body.eyfiber-login .ey-footer-mark{font-size:21px!important}
  body.eyfiber-login .ey-footer-sep{height:26px!important}
}