/* QA241 · Solo Login PetOrder Pro. Identidad original azul/blanco.
   Lado izquierdo discreto y funcional; NO afecta a otras pantallas. */
body.ppo-login-view{
  min-height:100dvh;
  margin:0!important;
  background:#f4f7fb!important;
  color:#17324d;
  font-family:Arial,Helvetica,sans-serif;
}
body.ppo-login-view .ppo-login-shell{
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(240px,32%) minmax(0,68%);
  width:min(1040px,calc(100% - 36px));
  min-height:570px;
  margin:clamp(24px,5vh,64px) auto;
  overflow:hidden;
  background:#fff;
  border:1px solid #dae4ef;
  border-radius:18px;
  box-shadow:0 16px 50px rgba(22,59,99,.09);
}
body.ppo-login-view .ppo-login-brand{
  display:flex;
  flex-direction:column;
  gap:0;
  min-width:0;
  padding:40px 32px 30px;
  background:linear-gradient(165deg,#eff5fc 0%,#e8f0fa 100%);
  border-right:1px solid #dbe7f2;
  color:#193d65;
}
body.ppo-login-view .ppo-login-logo{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:19px;
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1.3;
}
body.ppo-login-view .ppo-login-logo span{
  font-size:23px;
  line-height:1;
}
body.ppo-login-view .ppo-login-brand-subtitle{
  color:#5b738c;
  margin:7px 0 0;
  font-size:12px;
  line-height:1.5;
}
body.ppo-login-view .ppo-login-brand-message{
  margin:auto 0;
  padding:34px 0;
}
body.ppo-login-view .ppo-login-overline{
  margin:0 0 14px;
  color:#2469a6;
  font-size:10px;
  font-weight:700;
  letter-spacing:.11em;
  line-height:1.65;
}
body.ppo-login-view .ppo-login-brand h1{
  margin:0 0 14px;
  color:#193e68;
  font-size:clamp(22px,2vw,26px);
  line-height:1.25;
  font-weight:750;
  letter-spacing:-.025em;
  text-align:left;
}
body.ppo-login-view .ppo-login-brand-copy{
  margin:0;
  font-size:13px;
  color:#536d87;
  line-height:1.65;
}
body.ppo-login-view .ppo-login-brand-note{
  margin:0;
  font-size:11px;
  color:#7389a0;
  line-height:1.5;
}
body.ppo-login-view .ppo-login-content{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:22px;
  min-width:0;
  padding:48px 34px 30px;
}
body.ppo-login-view .ppo-login-shell .login-container{
  box-sizing:border-box!important;
  display:block!important;
  width:min(100%,420px)!important;
  max-width:420px!important;
  margin:0 auto!important;
  padding:0!important;
  text-align:left!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.ppo-login-view .ppo-login-eyebrow{
  display:inline-block;
  margin-bottom:15px;
  padding:7px 12px;
  border-radius:999px;
  background:#eef4fb;
  color:#245d93;
  font-size:10px;
  font-weight:700;
  letter-spacing:.065em;
  text-transform:uppercase;
}
body.ppo-login-view .ppo-login-shell .login-container h2{
  margin:0 0 8px!important;
  color:#173b63!important;
  font-size:clamp(21px,2vw,25px)!important;
  line-height:1.25!important;
  font-weight:700!important;
  text-align:left!important;
}
body.ppo-login-view .ppo-login-intro{
  margin:0 0 26px;
  color:#677e92;
  font-size:13px;
  line-height:1.6;
}
body.ppo-login-view .ppo-login-field-label{
  display:block;
  margin:14px 0 7px;
  color:#274766;
  font-size:12px;
  font-weight:700;
}
body.ppo-login-view .ppo-login-shell .login-container #email,
body.ppo-login-view .ppo-login-shell .login-container #password{
  display:block!important;
  width:100%!important;
  height:44px!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 13px!important;
  background:white!important;
  border:1px solid #cbd9e7!important;
  border-radius:9px!important;
  color:#17324d!important;
  font-size:13px!important;
  box-shadow:none!important;
}
body.ppo-login-view .ppo-login-shell #email:focus,
body.ppo-login-view .ppo-login-shell #password:focus{
  outline:2px solid rgba(25,118,210,.18)!important;
  border-color:#1976d2!important;
}
body.ppo-login-view .ppo-login-shell #btnLogin{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:22px 0 0!important;
  padding:11px 18px!important;
  min-height:45px!important;
  border:0!important;
  border-radius:9px!important;
  background:#1976d2!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:700!important;
  cursor:pointer;
}
body.ppo-login-view .ppo-login-shell #btnLogin:hover:not(:disabled){background:#155fba!important}
body.ppo-login-view .ppo-login-shell #btnLogin:disabled{opacity:.7;cursor:wait}
body.ppo-login-view .ppo-login-shell #mensaje{
  min-height:20px;
  margin:12px 0 0;
  color:#a23a35;
  text-align:center;
  font-size:12px;
  line-height:1.5;
}
body.ppo-login-view .ppo-login-shell #organizationPicker{
  margin:16px 0 0;
  font-size:12px;
}
body.ppo-login-view .ppo-login-shell #btnMostrarRegistro{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  min-height:40px!important;
  margin:16px 0 0!important;
  padding:9px 14px!important;
  font-size:12px!important;
  color:#245d93!important;
  background:#eef4fb!important;
  border:1px solid #d1e0ed!important;
  border-radius:9px!important;
}
body.ppo-login-view .ppo-login-shell .registro-box{
  max-height:min(390px,48vh);
  overflow:auto;
  padding-right:5px;
  font-size:12px;
}
body.ppo-login-view .ppo-login-footer{
  width:min(100%,420px);
  margin:0;
  color:#8293a5;
  font-size:11px;
  line-height:1.5;
  text-align:center;
}
@media(max-width:740px){
 body.ppo-login-view .ppo-login-shell{
   grid-template-columns:minmax(0,1fr);
   min-height:0;
   width:min(560px,calc(100% - 24px));
   margin:16px auto;
 }
 body.ppo-login-view .ppo-login-brand{
   padding:22px 24px 18px;
   border-right:0;
   border-bottom:1px solid #dae5f0;
 }
 body.ppo-login-view .ppo-login-brand-message{margin:12px 0 0;padding:0}
 body.ppo-login-view .ppo-login-brand h1{font-size:19px;line-height:1.3;margin-bottom:5px}
 body.ppo-login-view .ppo-login-overline,
 body.ppo-login-view .ppo-login-brand-note{display:none}
 body.ppo-login-view .ppo-login-brand-copy{font-size:12px;line-height:1.5}
 body.ppo-login-view .ppo-login-content{padding:26px 22px 24px;gap:18px}
 body.ppo-login-view .ppo-login-shell .login-container h2{font-size:21px!important}
}
@media(max-width:380px){
 body.ppo-login-view .ppo-login-shell{width:calc(100% - 16px);margin:8px auto}
 body.ppo-login-view .ppo-login-brand{padding:18px 17px 14px}
 body.ppo-login-view .ppo-login-content{padding:22px 17px}
 body.ppo-login-view .ppo-login-footer{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 body.ppo-login-view *{scroll-behavior:auto!important;transition:none!important}
}
